diff --git a/packages/react-reconciler/src/ReactFiber.new.js b/packages/react-reconciler/src/ReactFiber.new.js index 33fc93ef93619..58aabf70afa58 100644 --- a/packages/react-reconciler/src/ReactFiber.new.js +++ b/packages/react-reconciler/src/ReactFiber.new.js @@ -715,7 +715,9 @@ export function createFiberFromOffscreen( const fiber = createFiber(OffscreenComponent, pendingProps, key, mode); fiber.elementType = REACT_OFFSCREEN_TYPE; fiber.lanes = lanes; - const primaryChildInstance: OffscreenInstance = {}; + const primaryChildInstance: OffscreenInstance = { + isHidden: false, + }; fiber.stateNode = primaryChildInstance; return fiber; } diff --git a/packages/react-reconciler/src/ReactFiber.old.js b/packages/react-reconciler/src/ReactFiber.old.js index a65f460c6b27e..afa8f26503ccd 100644 --- a/packages/react-reconciler/src/ReactFiber.old.js +++ b/packages/react-reconciler/src/ReactFiber.old.js @@ -715,7 +715,9 @@ export function createFiberFromOffscreen( const fiber = createFiber(OffscreenComponent, pendingProps, key, mode); fiber.elementType = REACT_OFFSCREEN_TYPE; fiber.lanes = lanes; - const primaryChildInstance: OffscreenInstance = {}; + const primaryChildInstance: OffscreenInstance = { + isHidden: false, + }; fiber.stateNode = primaryChildInstance; return fiber; } diff --git a/packages/react-reconciler/src/ReactFiberCommitWork.new.js b/packages/react-reconciler/src/ReactFiberCommitWork.new.js index d023c1f776b3d..19052fd733570 100644 --- a/packages/react-reconciler/src/ReactFiberCommitWork.new.js +++ b/packages/react-reconciler/src/ReactFiberCommitWork.new.js @@ -2354,10 +2354,15 @@ function commitMutationEffectsOnFiber( commitReconciliationEffects(finishedWork); if (flags & Visibility) { + const instance: OffscreenInstance = finishedWork.stateNode; const newState: OffscreenState | null = finishedWork.memoizedState; const isHidden = newState !== null; const offscreenBoundary: Fiber = finishedWork; + // Track the current state on the Offscreen instance so we can + // read it during an event + instance.isHidden = isHidden; + if (enableSuspenseLayoutEffectSemantics) { if (isHidden) { if (!wasHidden) { diff --git a/packages/react-reconciler/src/ReactFiberCommitWork.old.js b/packages/react-reconciler/src/ReactFiberCommitWork.old.js index a9eae21939df2..ba50ceb60e8f4 100644 --- a/packages/react-reconciler/src/ReactFiberCommitWork.old.js +++ b/packages/react-reconciler/src/ReactFiberCommitWork.old.js @@ -2354,10 +2354,15 @@ function commitMutationEffectsOnFiber( commitReconciliationEffects(finishedWork); if (flags & Visibility) { + const instance: OffscreenInstance = finishedWork.stateNode; const newState: OffscreenState | null = finishedWork.memoizedState; const isHidden = newState !== null; const offscreenBoundary: Fiber = finishedWork; + // Track the current state on the Offscreen instance so we can + // read it during an event + instance.isHidden = isHidden; + if (enableSuspenseLayoutEffectSemantics) { if (isHidden) { if (!wasHidden) { diff --git a/packages/react-reconciler/src/ReactFiberOffscreenComponent.js b/packages/react-reconciler/src/ReactFiberOffscreenComponent.js index 05952f77a0fdf..b43188103e6fa 100644 --- a/packages/react-reconciler/src/ReactFiberOffscreenComponent.js +++ b/packages/react-reconciler/src/ReactFiberOffscreenComponent.js @@ -38,4 +38,6 @@ export type OffscreenQueue = {| transitions: Array | null, |} | null; -export type OffscreenInstance = {}; +export type OffscreenInstance = {| + isHidden: boolean, +|};