Move Offscreen manual check to a function

facebook · Oct 13, 2022 · f189031 · f189031
1 parent 290f8e0
commit f189031
Show file tree

Hide file tree

Showing 6 changed files with 17 additions and 17 deletions.
diff --git a/packages/react-reconciler/src/ReactFiberCommitWork.new.js b/packages/react-reconciler/src/ReactFiberCommitWork.new.js
@@ -22,11 +22,12 @@ import type {SuspenseState} from './ReactFiberSuspenseComponent.new';
 import type {UpdateQueue} from './ReactFiberClassUpdateQueue.new';
 import type {FunctionComponentUpdateQueue} from './ReactFiberHooks.new';
 import type {Wakeable} from 'shared/ReactTypes';
-import type {
+import {
   OffscreenState,
   OffscreenInstance,
   OffscreenQueue,
   OffscreenProps,
+  isOffscreenManual,
 } from './ReactFiberOffscreenComponent';
 import type {HookFlags} from './ReactHookEffectTags';
 import type {Cache} from './ReactFiberCacheComponent.new';
@@ -2896,10 +2897,7 @@ function commitMutationEffectsOnFiber(
         }
 
         // Offscreen with manual mode manages visibility manually.
-        const shouldControlChildrenVisibility =
-          finishedWork.memoizedProps === null ||
-          finishedWork.memoizedProps.mode !== 'manual';
-        if (supportsMutation && shouldControlChildrenVisibility) {
+        if (supportsMutation && !isOffscreenManual(finishedWork)) {
           // TODO: This needs to run whenever there's an insertion or update
           // inside a hidden Offscreen tree.
           hideOrUnhideAllChildren(offscreenBoundary, isHidden);

diff --git a/packages/react-reconciler/src/ReactFiberCommitWork.old.js b/packages/react-reconciler/src/ReactFiberCommitWork.old.js
@@ -22,11 +22,12 @@ import type {SuspenseState} from './ReactFiberSuspenseComponent.old';
 import type {UpdateQueue} from './ReactFiberClassUpdateQueue.old';
 import type {FunctionComponentUpdateQueue} from './ReactFiberHooks.old';
 import type {Wakeable} from 'shared/ReactTypes';
-import type {
+import {
   OffscreenState,
   OffscreenInstance,
   OffscreenQueue,
   OffscreenProps,
+  isOffscreenManual,
 } from './ReactFiberOffscreenComponent';
 import type {HookFlags} from './ReactHookEffectTags';
 import type {Cache} from './ReactFiberCacheComponent.old';
@@ -2896,10 +2897,7 @@ function commitMutationEffectsOnFiber(
         }
 
         // Offscreen with manual mode manages visibility manually.
-        const shouldControlChildrenVisibility =
-          finishedWork.memoizedProps === null ||
-          finishedWork.memoizedProps.mode !== 'manual';
-        if (supportsMutation && shouldControlChildrenVisibility) {
+        if (supportsMutation && !isOffscreenManual(finishedWork)) {
           // TODO: This needs to run whenever there's an insertion or update
           // inside a hidden Offscreen tree.
           hideOrUnhideAllChildren(offscreenBoundary, isHidden);

diff --git a/packages/react-reconciler/src/ReactFiberCompleteWork.new.js b/packages/react-reconciler/src/ReactFiberCompleteWork.new.js
@@ -27,7 +27,7 @@ import type {
   SuspenseState,
   SuspenseListRenderState,
 } from './ReactFiberSuspenseComponent.new';
-import type {OffscreenState} from './ReactFiberOffscreenComponent';
+import {isOffscreenManual, OffscreenState} from './ReactFiberOffscreenComponent';
 import type {TracingMarkerInstance} from './ReactFiberTracingMarkerComponent.new';
 import type {Cache} from './ReactFiberCacheComponent.new';
 import {
@@ -429,8 +429,7 @@ if (supportsMutation) {
           child.return = node;
         }
         // If Offscreen is not in manual mode, detached tree is hidden from user space.
-        const _needsVisibilityToggle =
-          node.memoizedProps === null || node.memoizedProps.mode !== 'manual';
+        const _needsVisibilityToggle = !isOffscreenManual(node);
         appendAllChildrenToContainer(
           containerChildSet,
           node,

diff --git a/packages/react-reconciler/src/ReactFiberCompleteWork.old.js b/packages/react-reconciler/src/ReactFiberCompleteWork.old.js
@@ -27,7 +27,7 @@ import type {
   SuspenseState,
   SuspenseListRenderState,
 } from './ReactFiberSuspenseComponent.old';
-import type {OffscreenState} from './ReactFiberOffscreenComponent';
+import {isOffscreenManual, OffscreenState} from './ReactFiberOffscreenComponent';
 import type {TracingMarkerInstance} from './ReactFiberTracingMarkerComponent.old';
 import type {Cache} from './ReactFiberCacheComponent.old';
 import {
@@ -429,8 +429,7 @@ if (supportsMutation) {
           child.return = node;
         }
         // If Offscreen is not in manual mode, detached tree is hidden from user space.
-        const _needsVisibilityToggle =
-          node.memoizedProps === null || node.memoizedProps.mode !== 'manual';
+        const _needsVisibilityToggle = !isOffscreenManual(node);
         appendAllChildrenToContainer(
           containerChildSet,
           node,

diff --git a/packages/react-reconciler/src/ReactFiberOffscreenComponent.js b/packages/react-reconciler/src/ReactFiberOffscreenComponent.js
@@ -62,3 +62,9 @@ export type OffscreenInstance = {
 
   // TODO: attach
 };
+
+
+export function isOffscreenManual(offscreenFiber: Fiber): boolean {
+  return offscreenFiber.memoizedProps !== null &&
+    offscreenFiber.memoizedProps.mode === 'manual';
+}
diff --git a/scripts/error-codes/codes.json b/scripts/error-codes/codes.json
@@ -441,5 +441,5 @@
   "453": "React expected a <head> element (document.head) to exist in the Document but one was not found. React never removes the head for any Document it renders into so the cause is likely in some other script running on this page.",
   "454": "React expected a <body> element (document.body) to exist in the Document but one was not found. React never removes the body for any Document it renders into so the cause is likely in some other script running on this page.",
   "455": "This CacheSignal was requested outside React which means that it is immediately aborted.",
-  "456": "Calling Offscreen.detach before instance handle has been set.",
+  "456": "Calling Offscreen.detach before instance handle has been set."
 }