diff --git a/packages/react-reconciler/src/ReactFiberBeginWork.js b/packages/react-reconciler/src/ReactFiberBeginWork.js index 8d978f8ece366..21b8be59cb9c8 100644 --- a/packages/react-reconciler/src/ReactFiberBeginWork.js +++ b/packages/react-reconciler/src/ReactFiberBeginWork.js @@ -884,7 +884,7 @@ function updateHostComponent(current, workInProgress, renderExpirationTime) { shouldDeprioritizeSubtree(type, nextProps) ) { // Schedule this fiber to re-render at offscreen priority. Then bailout. - workInProgress.expirationTime = Never; + workInProgress.expirationTime = workInProgress.childExpirationTime = Never; return null; } diff --git a/packages/react-reconciler/src/__tests__/ReactNewContext-test.internal.js b/packages/react-reconciler/src/__tests__/ReactNewContext-test.internal.js index 9f3d2d6c4d2a9..3b9873923a173 100644 --- a/packages/react-reconciler/src/__tests__/ReactNewContext-test.internal.js +++ b/packages/react-reconciler/src/__tests__/ReactNewContext-test.internal.js @@ -883,6 +883,37 @@ describe('ReactNewContext', () => { expect(ReactNoop.getChildren()).toEqual([span(2), span(2)]); }); + it("context consumer doesn't bail out inside hidden subtree", () => { + const Context = React.createContext('dark'); + const Consumer = getConsumer(Context); + + function App({theme}) { + return ( + + + + ); + } + + ReactNoop.render(); + expect(ReactNoop.flush()).toEqual(['dark']); + expect(ReactNoop.getChildrenAsJSX()).toEqual( + , + ); + + ReactNoop.render(); + expect(ReactNoop.flush()).toEqual(['light']); + expect(ReactNoop.getChildrenAsJSX()).toEqual( + , + ); + }); + // This is a regression case for https://github.com/facebook/react/issues/12389. it('does not run into an infinite loop', () => { const Context = React.createContext(null);