diff --git a/packages/react-reconciler/src/ReactFiberHotReloading.js b/packages/react-reconciler/src/ReactFiberHotReloading.js index 9645fdca2b..ae7c9bd7e7 100644 --- a/packages/react-reconciler/src/ReactFiberHotReloading.js +++ b/packages/react-reconciler/src/ReactFiberHotReloading.js @@ -292,26 +292,30 @@ function scheduleFibersWithFamiliesRecursively( } } -export function findHostNodesForHotUpdate( +export function findHostInstancesForHotUpdate( root: FiberRoot, families: Array, ): Set { if (__DEV__) { - const hostNodes = new Set(); + const hostInstances = new Set(); const types = new Set(families.map(family => family.current)); - findHostNodesForMatchingFibersRecursively(root.current, types, hostNodes); - return hostNodes; + findHostInstancesForMatchingFibersRecursively( + root.current, + types, + hostInstances, + ); + return hostInstances; } else { throw new Error( - 'Did not expect findHostNodesForHotUpdate to be called in production.', + 'Did not expect findHostInstancesForHotUpdate to be called in production.', ); } } -function findHostNodesForMatchingFibersRecursively( +function findHostInstancesForMatchingFibersRecursively( fiber: Fiber, types: Set, - hostNodes: Set, + hostInstances: Set, ) { if (__DEV__) { const {child, sibling, tag, type} = fiber; @@ -341,30 +345,38 @@ function findHostNodesForMatchingFibersRecursively( // We have a match. This only drills down to the closest host components. // There's no need to search deeper because for the purpose of giving // visual feedback, "flashing" outermost parent rectangles is sufficient. - findHostNodesForFiberShallowly(fiber, hostNodes); + findHostInstancesForFiberShallowly(fiber, hostInstances); } else { // If there's no match, maybe there will be one further down in the child tree. if (child !== null) { - findHostNodesForMatchingFibersRecursively(child, types, hostNodes); + findHostInstancesForMatchingFibersRecursively( + child, + types, + hostInstances, + ); } } if (sibling !== null) { - findHostNodesForMatchingFibersRecursively(sibling, types, hostNodes); + findHostInstancesForMatchingFibersRecursively( + sibling, + types, + hostInstances, + ); } } } -function findHostNodesForFiberShallowly( +function findHostInstancesForFiberShallowly( fiber: Fiber, - hostNodes: Set, + hostInstances: Set, ): void { if (__DEV__) { - const foundHostNodes = findChildHostNodesForFiberShallowly( + const foundHostInstances = findChildHostInstancesForFiberShallowly( fiber, - hostNodes, + hostInstances, ); - if (foundHostNodes) { + if (foundHostInstances) { return; } // If we didn't find any host children, fallback to closest host parent. @@ -372,13 +384,13 @@ function findHostNodesForFiberShallowly( while (true) { switch (node.tag) { case HostComponent: - hostNodes.add(node.stateNode); + hostInstances.add(node.stateNode); return; case HostPortal: - hostNodes.add(node.stateNode.containerInfo); + hostInstances.add(node.stateNode.containerInfo); return; case HostRoot: - hostNodes.add(node.stateNode.containerInfo); + hostInstances.add(node.stateNode.containerInfo); return; } if (node.return === null) { @@ -389,18 +401,18 @@ function findHostNodesForFiberShallowly( } } -function findChildHostNodesForFiberShallowly( +function findChildHostInstancesForFiberShallowly( fiber: Fiber, - hostNodes: Set, + hostInstances: Set, ): boolean { if (__DEV__) { let node: Fiber = fiber; - let foundHostNodes = false; + let foundHostInstances = false; while (true) { if (node.tag === HostComponent) { // We got a match. - foundHostNodes = true; - hostNodes.add(node.stateNode); + foundHostInstances = true; + hostInstances.add(node.stateNode); // There may still be more, so keep searching. } else if (node.child !== null) { node.child.return = node; @@ -408,11 +420,11 @@ function findChildHostNodesForFiberShallowly( continue; } if (node === fiber) { - return foundHostNodes; + return foundHostInstances; } while (node.sibling === null) { if (node.return === null || node.return === fiber) { - return foundHostNodes; + return foundHostInstances; } node = node.return; } diff --git a/packages/react-reconciler/src/ReactFiberReconciler.js b/packages/react-reconciler/src/ReactFiberReconciler.js index df1828a233..5300872062 100644 --- a/packages/react-reconciler/src/ReactFiberReconciler.js +++ b/packages/react-reconciler/src/ReactFiberReconciler.js @@ -72,7 +72,7 @@ import {revertPassiveEffectsChange} from 'shared/ReactFeatureFlags'; import {requestCurrentSuspenseConfig} from './ReactFiberSuspenseConfig'; import { scheduleHotUpdate, - findHostNodesForHotUpdate, + findHostInstancesForHotUpdate, } from './ReactFiberHotReloading'; type OpaqueRoot = FiberRoot; @@ -475,7 +475,9 @@ export function injectIntoDevTools(devToolsConfig: DevToolsConfig): boolean { return injectInternals({ ...devToolsConfig, - findHostNodesForHotUpdate: __DEV__ ? findHostNodesForHotUpdate : null, + findHostInstancesForHotUpdate: __DEV__ + ? findHostInstancesForHotUpdate + : null, scheduleHotUpdate: __DEV__ ? scheduleHotUpdate : null, overrideHookState, overrideProps, diff --git a/packages/react-refresh/src/__tests__/ReactFresh-test.js b/packages/react-refresh/src/__tests__/ReactFresh-test.js index 255b311779..f7ebc8dd8d 100644 --- a/packages/react-refresh/src/__tests__/ReactFresh-test.js +++ b/packages/react-refresh/src/__tests__/ReactFresh-test.js @@ -20,7 +20,7 @@ let act; describe('ReactFresh', () => { let container; let lastRoot; - let findHostNodesForHotUpdate; + let findHostInstancesForHotUpdate; let scheduleHotUpdate; beforeEach(() => { @@ -28,7 +28,7 @@ describe('ReactFresh', () => { supportsFiber: true, inject: injected => { scheduleHotUpdate = injected.scheduleHotUpdate; - findHostNodesForHotUpdate = injected.findHostNodesForHotUpdate; + findHostInstancesForHotUpdate = injected.findHostInstancesForHotUpdate; }, onCommitFiberRoot: (id, root) => { lastRoot = root; @@ -2937,7 +2937,7 @@ describe('ReactFresh', () => { } }); - it('can find host nodes for a family', () => { + it('can find host instances for a family', () => { if (__DEV__) { render(() => { function Child({children}) { @@ -3010,37 +3010,37 @@ describe('ReactFresh', () => { const childFamily = ReactFreshRuntime.getFamilyByID('Child'); const emptyFamily = ReactFreshRuntime.getFamilyByID('Empty'); - testFindNodesForFamilies( + testFindHostInstancesForFamilies( [parentFamily], container.querySelectorAll('.Parent'), ); - testFindNodesForFamilies( + testFindHostInstancesForFamilies( [childFamily], container.querySelectorAll('.Child'), ); // When searching for both Parent and Child, // we'll stop visual highlighting at the Parent. - testFindNodesForFamilies( + testFindHostInstancesForFamilies( [parentFamily, childFamily], container.querySelectorAll('.Parent'), ); // When we can't find host nodes, use the closest parent. - testFindNodesForFamilies( + testFindHostInstancesForFamilies( [emptyFamily], container.querySelectorAll('.App'), ); } }); - function testFindNodesForFamilies(families, expectedNodes) { - const foundNodes = Array.from( - findHostNodesForHotUpdate(lastRoot, families), + function testFindHostInstancesForFamilies(families, expectedNodes) { + const foundInstances = Array.from( + findHostInstancesForHotUpdate(lastRoot, families), ); - expect(foundNodes.length).toEqual(expectedNodes.length); - foundNodes.forEach((node, i) => { + expect(foundInstances.length).toEqual(expectedNodes.length); + foundInstances.forEach((node, i) => { expect(node).toBe(expectedNodes[i]); }); }