diff --git a/packages/react-reconciler/src/ReactFiberBeginWork.js b/packages/react-reconciler/src/ReactFiberBeginWork.js index 97a99f005ee18..28484c9fd37ac 100644 --- a/packages/react-reconciler/src/ReactFiberBeginWork.js +++ b/packages/react-reconciler/src/ReactFiberBeginWork.js @@ -83,13 +83,7 @@ import { Never, computeAsyncExpiration, } from './ReactFiberExpirationTime'; -import { - ConcurrentMode, - NoMode, - ProfileMode, - StrictMode, - BatchedMode, -} from './ReactTypeOfMode'; +import {NoMode, ProfileMode, StrictMode, BatchedMode} from './ReactTypeOfMode'; import { shouldSetTextContent, shouldDeprioritizeSubtree, @@ -974,7 +968,7 @@ function updateHostComponent(current, workInProgress, renderExpirationTime) { // Check the host config to see if the children are offscreen/hidden. if ( renderExpirationTime !== Never && - workInProgress.mode & ConcurrentMode && + workInProgress.mode & BatchedMode && shouldDeprioritizeSubtree(type, nextProps) ) { // Schedule this fiber to re-render at offscreen priority. Then bailout. diff --git a/packages/react-reconciler/src/ReactFiberScheduler.js b/packages/react-reconciler/src/ReactFiberScheduler.js index 3de722bf11d21..e79187d440856 100644 --- a/packages/react-reconciler/src/ReactFiberScheduler.js +++ b/packages/react-reconciler/src/ReactFiberScheduler.js @@ -62,6 +62,7 @@ import { BatchedMode, ConcurrentMode, } from './ReactTypeOfMode'; +import {ConcurrentRoot} from 'shared/ReactRootTags'; import { HostRoot, ClassComponent, @@ -728,6 +729,10 @@ function renderRoot( 'Should not already be working.', ); + if (root.tag !== ConcurrentRoot) { + isSync = true; + } + if (enableUserTimingAPI && expirationTime !== Sync) { const didExpire = isSync; stopRequestCallbackTimer(didExpire); diff --git a/packages/react-reconciler/src/__tests__/ReactBatchedMode-test.internal.js b/packages/react-reconciler/src/__tests__/ReactBatchedMode-test.internal.js index 670b0e49fb1bc..be7d883af6a29 100644 --- a/packages/react-reconciler/src/__tests__/ReactBatchedMode-test.internal.js +++ b/packages/react-reconciler/src/__tests__/ReactBatchedMode-test.internal.js @@ -163,4 +163,46 @@ describe('ReactBatchedMode', () => { expect(Scheduler).toFlushExpired(['A1']); expect(root).toMatchRenderedOutput('A1B1'); }); + + it('hidden subtrees are deprioritized but not yieldy', () => { + const {useEffect} = React; + + const root = ReactNoop.createSyncRoot(); + function App() { + useEffect(() => Scheduler.yieldValue('Commit')); + return ( + }> + +
+ + + +
+
+ ); + } + + root.render(); + expect(Scheduler).toFlushAndYieldThrough(['D', 'E', 'F', 'Commit']); + expect(root).toMatchRenderedOutput( + +