Skip to content

Commit 4c65d54

Browse files
committed
Add test for context consumers inside hidden subtree
Should not bail out during subsequent update. (This isn't directly related to this PR because we should have had this test, anyway.)
1 parent f13dccf commit 4c65d54

File tree

2 files changed

+32
-1
lines changed

2 files changed

+32
-1
lines changed

packages/react-reconciler/src/ReactFiberBeginWork.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -884,7 +884,7 @@ function updateHostComponent(current, workInProgress, renderExpirationTime) {
884884
shouldDeprioritizeSubtree(type, nextProps)
885885
) {
886886
// Schedule this fiber to re-render at offscreen priority. Then bailout.
887-
workInProgress.expirationTime = Never;
887+
workInProgress.expirationTime = workInProgress.childExpirationTime = Never;
888888
return null;
889889
}
890890

packages/react-reconciler/src/__tests__/ReactNewContext-test.internal.js

Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -883,6 +883,37 @@ describe('ReactNewContext', () => {
883883
expect(ReactNoop.getChildren()).toEqual([span(2), span(2)]);
884884
});
885885

886+
it("context consumer doesn't bail out inside hidden subtree", () => {
887+
const Context = React.createContext('dark');
888+
const Consumer = getConsumer(Context);
889+
890+
function App({theme}) {
891+
return (
892+
<Context.Provider value={theme}>
893+
<div hidden={true}>
894+
<Consumer>{value => <Text text={value} />}</Consumer>
895+
</div>
896+
</Context.Provider>
897+
);
898+
}
899+
900+
ReactNoop.render(<App theme="dark" />);
901+
expect(ReactNoop.flush()).toEqual(['dark']);
902+
expect(ReactNoop.getChildrenAsJSX()).toEqual(
903+
<div hidden={true}>
904+
<span prop="dark" />
905+
</div>,
906+
);
907+
908+
ReactNoop.render(<App theme="light" />);
909+
expect(ReactNoop.flush()).toEqual(['light']);
910+
expect(ReactNoop.getChildrenAsJSX()).toEqual(
911+
<div hidden={true}>
912+
<span prop="light" />
913+
</div>,
914+
);
915+
});
916+
886917
// This is a regression case for https://github.com/facebook/react/issues/12389.
887918
it('does not run into an infinite loop', () => {
888919
const Context = React.createContext(null);

0 commit comments

Comments
 (0)