Compare commits
2 Commits
main
...
ty-add-reg
| Author | SHA1 | Date |
|---|---|---|
|
|
12b14c4867 | |
|
|
ec94d67be8 |
|
|
@ -1772,4 +1772,72 @@ describe('ReactDOMServerSelectiveHydration', () => {
|
|||
|
||||
document.body.removeChild(container);
|
||||
});
|
||||
|
||||
// @gate experimental || www
|
||||
it('regression test: can unwind context on selective hydration interruption', async () => {
|
||||
const Context = React.createContext('DefaultContext');
|
||||
|
||||
function ContextReader(props) {
|
||||
const value = React.useContext(Context);
|
||||
Scheduler.unstable_yieldValue(value);
|
||||
return null;
|
||||
}
|
||||
|
||||
function Child({text}) {
|
||||
Scheduler.unstable_yieldValue(text);
|
||||
return <span>{text}</span>;
|
||||
}
|
||||
const ChildWithBoundary = React.memo(function({text}) {
|
||||
return (
|
||||
<Suspense fallback="Loading...">
|
||||
<Child text={text} />
|
||||
</Suspense>
|
||||
);
|
||||
});
|
||||
|
||||
function App({a}) {
|
||||
Scheduler.unstable_yieldValue('App');
|
||||
React.useEffect(() => {
|
||||
Scheduler.unstable_yieldValue('Commit');
|
||||
});
|
||||
return (
|
||||
<>
|
||||
<Context.Provider value="SiblingContext">
|
||||
<ChildWithBoundary text={a} />
|
||||
</Context.Provider>
|
||||
<ContextReader />
|
||||
</>
|
||||
);
|
||||
}
|
||||
const finalHTML = ReactDOMServer.renderToString(<App a="A" />);
|
||||
expect(Scheduler).toHaveYielded(['App', 'A', 'DefaultContext']);
|
||||
const container = document.createElement('div');
|
||||
container.innerHTML = finalHTML;
|
||||
document.body.appendChild(container);
|
||||
|
||||
const spanA = container.getElementsByTagName('span')[0];
|
||||
|
||||
await act(async () => {
|
||||
const root = ReactDOMClient.hydrateRoot(container, <App a="A" />);
|
||||
expect(Scheduler).toFlushAndYieldThrough([
|
||||
'App',
|
||||
'DefaultContext',
|
||||
'Commit',
|
||||
]);
|
||||
|
||||
TODO_scheduleIdleDOMSchedulerTask(() => {
|
||||
root.render(<App a="AA" />);
|
||||
});
|
||||
expect(Scheduler).toFlushAndYieldThrough(['App', 'AA', 'DefaultContext']);
|
||||
|
||||
dispatchClickEvent(spanA);
|
||||
expect(Scheduler).toHaveYielded(['A']);
|
||||
expect(Scheduler).toFlushAndYield([
|
||||
'App',
|
||||
'AA',
|
||||
'DefaultContext',
|
||||
'Commit',
|
||||
]);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
|
|
|||
Loading…
Reference in New Issue