Skip to content

[pull] main from facebook:main #270

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 2 commits into from
Sep 9, 2025
Merged

[pull] main from facebook:main #270

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
3d9d22c
[playground] Fix CompilerError mismatch (#34420)
EugeneChoi4 Sep 8, 2025
8943025
[DevTools] Fix handling of host roots on mount (#34400)
eps1lon Sep 8, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions compiler/apps/playground/components/Editor/EditorImpl.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ import BabelPluginReactCompiler, {
CompilerErrorDetail,
CompilerDiagnostic,
Effect,
ErrorSeverity,
ErrorCategory,
parseConfigPragmaForTests,
ValueKind,
type Hook,
Expand Down Expand Up @@ -258,7 +258,7 @@ function compile(
console.error(err);
error.details.push(
new CompilerErrorDetail({
severity: ErrorSeverity.Invariant,
category: ErrorCategory.Invariant,
reason: `Unexpected failure when transforming input! ${err}`,
loc: null,
suggestions: null,
Expand Down
1 change: 1 addition & 0 deletions compiler/packages/babel-plugin-react-compiler/src/index.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ export {
CompilerDiagnostic,
CompilerSuggestionOperation,
ErrorSeverity,
ErrorCategory,
LintRules,
type CompilerErrorDetailOptions,
type CompilerDiagnosticOptions,
Expand Down
6 changes: 3 additions & 3 deletions packages/react-devtools-shared/src/__tests__/profilingCommitTreeBuilder-test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -228,7 +228,7 @@ describe('commit tree', () => {
[root]
▾ <App>
<Suspense>
[shell]
[suspense-root] rects={null}
<Suspense name="App>?" rects={null}>
`);
utils.act(() => modernRender(<App renderChildren={true} />));
Expand All @@ -237,7 +237,7 @@ describe('commit tree', () => {
▾ <App>
▾ <Suspense>
<LazyInnerComponent>
[shell]
[suspense-root] rects={null}
<Suspense name="App>?" rects={null}>
`);
utils.act(() => modernRender(<App renderChildren={false} />));
Expand Down Expand Up @@ -303,7 +303,7 @@ describe('commit tree', () => {
[root]
▾ <App>
<Suspense>
[shell]
[suspense-root] rects={null}
<Suspense name="App>?" rects={null}>
`);
utils.act(() => modernRender(<App renderChildren={false} />));
Expand Down
83 changes: 44 additions & 39 deletions packages/react-devtools-shared/src/__tests__/store-test.js
View file
Open in desktop

Large diffs are not rendered by default.

6 changes: 3 additions & 3 deletions packages/react-devtools-shared/src/__tests__/storeComponentFilters-test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -156,7 +156,7 @@ describe('Store component filters', () => {
<div>
▾ <Suspense>
<div>
[shell]
[suspense-root] rects={[]}
<Suspense name="Unknown" rects={[]}>
<Suspense name="Unknown" rects={[]}>
`);
Expand All @@ -174,7 +174,7 @@ describe('Store component filters', () => {
<div>
▾ <Suspense>
<div>
[shell]
[suspense-root] rects={[]}
<Suspense name="Unknown" rects={[]}>
<Suspense name="Unknown" rects={[]}>
`);
Expand All @@ -192,7 +192,7 @@ describe('Store component filters', () => {
<div>
▾ <Suspense>
<div>
[shell]
[suspense-root] rects={[]}
<Suspense name="Unknown" rects={[]}>
<Suspense name="Unknown" rects={[]}>
`);
Expand Down
16 changes: 8 additions & 8 deletions packages/react-devtools-shared/src/__tests__/treeContext-test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1368,7 +1368,7 @@ describe('TreeListContext', () => {
▾ <Child>
▾ <Suspense>
<Grandchild>
[shell]
[suspense-root] rects={null}
<Suspense name="Parent>?" rects={null}>
<Suspense name="Child>?" rects={null}>
`);
Expand Down Expand Up @@ -1410,7 +1410,7 @@ describe('TreeListContext', () => {
▾ <Child>
▾ <Suspense>
<Grandchild>
[shell]
[suspense-root] rects={null}
<Suspense name="Parent>?" rects={null}>
<Suspense name="Child>?" rects={null}>
`);
Expand Down Expand Up @@ -2369,7 +2369,7 @@ describe('TreeListContext', () => {
expect(state).toMatchInlineSnapshot(`
[root]
<Suspense>
[shell]
[suspense-root] rects={null}
<Suspense name="Unknown" rects={null}>
`);

Expand All @@ -2378,7 +2378,7 @@ describe('TreeListContext', () => {
expect(state).toMatchInlineSnapshot(`
[root]
<Suspense>
[shell]
[suspense-root] rects={null}
<Suspense name="Unknown" rects={null}>
`);
});
Expand All @@ -2404,7 +2404,7 @@ describe('TreeListContext', () => {
expect(state).toMatchInlineSnapshot(`
[root]
<Suspense>
[shell]
[suspense-root] rects={null}
<Suspense name="Unknown" rects={null}>
`);

Expand All @@ -2426,7 +2426,7 @@ describe('TreeListContext', () => {
▾ <Suspense>
<Child> ⚠
<Child>
[shell]
[suspense-root] rects={null}
<Suspense name="Unknown" rects={null}>
`);
});
Expand Down Expand Up @@ -2456,7 +2456,7 @@ describe('TreeListContext', () => {
▾ <Suspense>
▾ <Fallback>
<Child> ✕
[shell]
[suspense-root] rects={null}
<Suspense name="Unknown" rects={null}>
`);

Expand All @@ -2475,7 +2475,7 @@ describe('TreeListContext', () => {
[root]
▾ <Suspense>
<Child>
[shell]
[suspense-root] rects={null}
<Suspense name="Unknown" rects={null}>
`);
});
Expand Down
42 changes: 23 additions & 19 deletions packages/react-devtools-shared/src/backend/fiber/renderer.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3700,28 +3700,32 @@ export function attach(
// just use the Fiber anyway.
// Fallbacks get attributed to the parent so we only measure if we're
// showing primary content.
if (OffscreenComponent === -1) {
const isTimedOut = fiber.memoizedState !== null;
if (!isTimedOut) {
newSuspenseNode.rects = measureInstance(newInstance);
}
} else {
const hydrated = isFiberHydrated(fiber);
if (hydrated) {
const contentFiber = fiber.child;
if (contentFiber === null) {
throw new Error(
'There should always be an Offscreen Fiber child in a hydrated Suspense boundary.',
);
if (fiber.tag === SuspenseComponent) {
if (OffscreenComponent === -1) {
const isTimedOut = fiber.memoizedState !== null;
if (!isTimedOut) {
newSuspenseNode.rects = measureInstance(newInstance);
}
} else {
// This Suspense Fiber is still dehydrated. It won't have any children
// until hydration.
}
const isTimedOut = fiber.memoizedState !== null;
if (!isTimedOut) {
newSuspenseNode.rects = measureInstance(newInstance);
const hydrated = isFiberHydrated(fiber);
if (hydrated) {
const contentFiber = fiber.child;
if (contentFiber === null) {
throw new Error(
'There should always be an Offscreen Fiber child in a hydrated Suspense boundary.',
);
}
} else {
// This Suspense Fiber is still dehydrated. It won't have any children
// until hydration.
}
const isTimedOut = fiber.memoizedState !== null;
if (!isTimedOut) {
newSuspenseNode.rects = measureInstance(newInstance);
}
}
} else {
newSuspenseNode.rects = measureInstance(newInstance);
}
recordSuspenseMount(newSuspenseNode, reconcilingParentSuspenseNode);
}
Expand Down
33 changes: 16 additions & 17 deletions packages/react-devtools-shared/src/devtools/utils.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -54,22 +54,21 @@ export function printElement(
}${key}${name}>${hocs}${suffix}`;
}

function printSuspense(
suspense: SuspenseNode,
includeWeight: boolean = false,
): string {
function printRects(rects: SuspenseNode['rects']): string {
if (rects === null) {
return ' rects={null}';
} else {
return ` rects={[${rects.map(rect => `{x:${rect.x},y:${rect.y},width:${rect.width},height:${rect.height}}`).join(', ')}]}`;
}
}

function printSuspense(suspense: SuspenseNode): string {
let name = '';
if (suspense.name !== null) {
name = ` name="${suspense.name}"`;
}

let printedRects = '';
const rects = suspense.rects;
if (rects === null) {
printedRects = ' rects={null}';
} else {
printedRects = ` rects={[${rects.map(rect => `{x:${rect.x},y:${rect.y},width:${rect.width},height:${rect.height}}`).join(', ')}]}`;
}
const printedRects = printRects(suspense.rects);

return `<Suspense${name}${printedRects}>`;
}
Expand Down Expand Up @@ -178,13 +177,13 @@ export function printStore(
rootWeight += weight;

if (includeSuspense) {
const shell = store.getSuspenseByID(rootID);
const root = store.getSuspenseByID(rootID);
// Roots from legacy renderers don't have a separate Suspense tree
if (shell !== null) {
if (shell.children.length > 0) {
snapshotLines.push('[shell]');
for (let i = 0; i < shell.children.length; i++) {
const childID = shell.children[i];
if (root !== null) {
if (root.children.length > 0) {
snapshotLines.push('[suspense-root] ' + printRects(root.rects));
for (let i = 0; i < root.children.length; i++) {
const childID = root.children[i];
const child = store.getSuspenseByID(childID);
if (child === null) {
throw new Error(
Expand Down
Loading