diff --git a/packages/react-reconciler/src/ReactFiberBeginWork.new.js b/packages/react-reconciler/src/ReactFiberBeginWork.new.js index e9c666f7f8ad9..2321b97ff89e2 100644 --- a/packages/react-reconciler/src/ReactFiberBeginWork.new.js +++ b/packages/react-reconciler/src/ReactFiberBeginWork.new.js @@ -2212,21 +2212,6 @@ function mountSuspenseFallbackChildren( primaryChildFragment.childLanes = NoLanes; primaryChildFragment.pendingProps = primaryChildProps; - if ( - supportsPersistence && - (workInProgress.mode & ConcurrentMode) === NoMode - ) { - const offscreenContainer: Fiber = (primaryChildFragment.child: any); - - const containerProps = getOffscreenContainerProps( - 'hidden', - primaryChildren, - ); - offscreenContainer.pendingProps = containerProps; - offscreenContainer.memoizedProps = containerProps; - completeSuspendedOffscreenHostContainer(null, offscreenContainer); - } - if (enableProfilerTimer && workInProgress.mode & ProfileMode) { // Reset the durations from the first pass so they aren't included in the // final amounts. This seems counterintuitive, since we're intentionally diff --git a/packages/react-reconciler/src/ReactFiberBeginWork.old.js b/packages/react-reconciler/src/ReactFiberBeginWork.old.js index f2dbbb6e34f77..dc66340f70a53 100644 --- a/packages/react-reconciler/src/ReactFiberBeginWork.old.js +++ b/packages/react-reconciler/src/ReactFiberBeginWork.old.js @@ -2212,21 +2212,6 @@ function mountSuspenseFallbackChildren( primaryChildFragment.childLanes = NoLanes; primaryChildFragment.pendingProps = primaryChildProps; - if ( - supportsPersistence && - (workInProgress.mode & ConcurrentMode) === NoMode - ) { - const offscreenContainer: Fiber = (primaryChildFragment.child: any); - - const containerProps = getOffscreenContainerProps( - 'hidden', - primaryChildren, - ); - offscreenContainer.pendingProps = containerProps; - offscreenContainer.memoizedProps = containerProps; - completeSuspendedOffscreenHostContainer(null, offscreenContainer); - } - if (enableProfilerTimer && workInProgress.mode & ProfileMode) { // Reset the durations from the first pass so they aren't included in the // final amounts. This seems counterintuitive, since we're intentionally diff --git a/packages/react-reconciler/src/ReactFiberThrow.new.js b/packages/react-reconciler/src/ReactFiberThrow.new.js index 874340a1eeaf2..e7816b017e473 100644 --- a/packages/react-reconciler/src/ReactFiberThrow.new.js +++ b/packages/react-reconciler/src/ReactFiberThrow.new.js @@ -33,6 +33,10 @@ import { LifecycleEffectMask, ForceUpdateForLegacySuspense, } from './ReactFiberFlags'; +import { + supportsPersistence, + getOffscreenContainerProps, +} from './ReactFiberHostConfig'; import {shouldCaptureSuspense} from './ReactFiberSuspenseComponent.new'; import {NoMode, ConcurrentMode, DebugTracingMode} from './ReactTypeOfMode'; import { @@ -313,6 +317,26 @@ function throwException( // all lifecycle effect tags. sourceFiber.flags &= ~(LifecycleEffectMask | Incomplete); + if (supportsPersistence) { + // Another legacy Suspense quirk. In persistent mode, if this is the + // initial mount, override the props of the host container to hide + // its contents. + const currentSuspenseBoundary = workInProgress.alternate; + if (currentSuspenseBoundary === null) { + const offscreenFiber: Fiber = (workInProgress.child: any); + const offscreenContainer = offscreenFiber.child; + if (offscreenContainer !== null) { + const children = offscreenContainer.memoizedProps.children; + const containerProps = getOffscreenContainerProps( + 'hidden', + children, + ); + offscreenContainer.pendingProps = containerProps; + offscreenContainer.memoizedProps = containerProps; + } + } + } + if (sourceFiber.tag === ClassComponent) { const currentSourceFiber = sourceFiber.alternate; if (currentSourceFiber === null) { diff --git a/packages/react-reconciler/src/ReactFiberThrow.old.js b/packages/react-reconciler/src/ReactFiberThrow.old.js index db11692c6ce39..70fda7bef55c1 100644 --- a/packages/react-reconciler/src/ReactFiberThrow.old.js +++ b/packages/react-reconciler/src/ReactFiberThrow.old.js @@ -33,6 +33,10 @@ import { LifecycleEffectMask, ForceUpdateForLegacySuspense, } from './ReactFiberFlags'; +import { + supportsPersistence, + getOffscreenContainerProps, +} from './ReactFiberHostConfig'; import {shouldCaptureSuspense} from './ReactFiberSuspenseComponent.old'; import {NoMode, ConcurrentMode, DebugTracingMode} from './ReactTypeOfMode'; import { @@ -313,6 +317,26 @@ function throwException( // all lifecycle effect tags. sourceFiber.flags &= ~(LifecycleEffectMask | Incomplete); + if (supportsPersistence) { + // Another legacy Suspense quirk. In persistent mode, if this is the + // initial mount, override the props of the host container to hide + // its contents. + const currentSuspenseBoundary = workInProgress.alternate; + if (currentSuspenseBoundary === null) { + const offscreenFiber: Fiber = (workInProgress.child: any); + const offscreenContainer = offscreenFiber.child; + if (offscreenContainer !== null) { + const children = offscreenContainer.memoizedProps.children; + const containerProps = getOffscreenContainerProps( + 'hidden', + children, + ); + offscreenContainer.pendingProps = containerProps; + offscreenContainer.memoizedProps = containerProps; + } + } + } + if (sourceFiber.tag === ClassComponent) { const currentSourceFiber = sourceFiber.alternate; if (currentSourceFiber === null) {