diff --git a/packages/react-devtools-shared/src/__tests__/store-test.js b/packages/react-devtools-shared/src/__tests__/store-test.js
index fad4622acc15b..3b60d5ae093e4 100644
--- a/packages/react-devtools-shared/src/__tests__/store-test.js
+++ b/packages/react-devtools-shared/src/__tests__/store-test.js
@@ -2489,7 +2489,7 @@ describe('Store', () => {
withErrorsOrWarningsIgnored(['test-only:'], async () => {
await act(() => render());
});
- expect(store).toMatchInlineSnapshot(`[root]`);
+ expect(store).toMatchInlineSnapshot(``);
expect(store.componentWithErrorCount).toBe(0);
expect(store.componentWithWarningCount).toBe(0);
});
@@ -3083,6 +3083,9 @@ describe('Store', () => {
it('should handle an empty root', async () => {
await actAsync(() => render(null));
+ expect(store).toMatchInlineSnapshot(``);
+
+ await actAsync(() => render());
expect(store).toMatchInlineSnapshot(`[root]`);
});
});
diff --git a/packages/react-devtools-shared/src/backend/fiber/renderer.js b/packages/react-devtools-shared/src/backend/fiber/renderer.js
index 3fe177e0797f1..aee89e8ca2c54 100644
--- a/packages/react-devtools-shared/src/backend/fiber/renderer.js
+++ b/packages/react-devtools-shared/src/backend/fiber/renderer.js
@@ -5322,12 +5322,12 @@ export function attach(
root: FiberRoot,
priorityLevel: void | number,
) {
- const current = root.current;
+ const nextFiber = root.current;
let prevFiber: null | Fiber = null;
let rootInstance = rootToFiberInstanceMap.get(root);
if (!rootInstance) {
- rootInstance = createFiberInstance(current);
+ rootInstance = createFiberInstance(nextFiber);
rootToFiberInstanceMap.set(root, rootInstance);
idToDevToolsInstanceMap.set(rootInstance.id, rootInstance);
} else {
@@ -5366,30 +5366,25 @@ export function attach(
};
}
- if (prevFiber !== null) {
- // TODO: relying on this seems a bit fishy.
- const wasMounted =
- prevFiber.memoizedState != null &&
- prevFiber.memoizedState.element != null;
- const isMounted =
- current.memoizedState != null && current.memoizedState.element != null;
- if (!wasMounted && isMounted) {
- // Mount a new root.
- setRootPseudoKey(currentRoot.id, current);
- mountFiberRecursively(current, false);
- } else if (wasMounted && isMounted) {
- // Update an existing root.
- updateFiberRecursively(rootInstance, current, prevFiber, false);
- } else if (wasMounted && !isMounted) {
- // Unmount an existing root.
- unmountInstanceRecursively(rootInstance);
- removeRootPseudoKey(currentRoot.id);
- rootToFiberInstanceMap.delete(root);
- }
- } else {
+ const nextIsMounted = nextFiber.child !== null;
+ const prevWasMounted = prevFiber !== null && prevFiber.child !== null;
+ if (!prevWasMounted && nextIsMounted) {
// Mount a new root.
- setRootPseudoKey(currentRoot.id, current);
- mountFiberRecursively(current, false);
+ setRootPseudoKey(currentRoot.id, nextFiber);
+ mountFiberRecursively(nextFiber, false);
+ } else if (prevWasMounted && nextIsMounted) {
+ if (prevFiber === null) {
+ throw new Error(
+ 'Expected a previous Fiber when updating an existing root.',
+ );
+ }
+ // Update an existing root.
+ updateFiberRecursively(rootInstance, nextFiber, prevFiber, false);
+ } else if (prevWasMounted && !nextIsMounted) {
+ // Unmount an existing root.
+ unmountInstanceRecursively(rootInstance);
+ removeRootPseudoKey(currentRoot.id);
+ rootToFiberInstanceMap.delete(root);
}
if (isProfiling && isProfilingSupported) {