Add regression tests where sync render causes later concurrent render to expire soon (#18608)

* Add a failing test for #17911

* Add more test cases where sync render causes later concurrent render to expire soon
This commit is contained in:
jddxf 2020-06-30 19:42:59 +08:00 committed by GitHub
parent 1887c5d946
commit fa32cf299f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -438,6 +438,70 @@ describe('ReactIncrementalUpdates', () => {
expect(ReactNoop.getChildren()).toEqual([span('derived state')]);
});
it('regression: does not expire soon due to layout effects in the last batch', () => {
const {useState, useLayoutEffect} = React;
let setCount;
function App() {
const [count, _setCount] = useState(0);
setCount = _setCount;
Scheduler.unstable_yieldValue('Render: ' + count);
useLayoutEffect(() => {
setCount(prevCount => prevCount + 1);
Scheduler.unstable_yieldValue('Commit: ' + count);
}, []);
return null;
}
ReactNoop.act(() => {
ReactNoop.render(<App />);
expect(Scheduler).toFlushExpired([]);
expect(Scheduler).toFlushAndYield([
'Render: 0',
'Commit: 0',
'Render: 1',
]);
Scheduler.unstable_advanceTime(10000);
setCount(2);
expect(Scheduler).toFlushExpired([]);
});
});
it('regression: does not expire soon due to previous flushSync', () => {
function Text({text}) {
Scheduler.unstable_yieldValue(text);
return text;
}
ReactNoop.flushSync(() => {
ReactNoop.render(<Text text="A" />);
});
expect(Scheduler).toHaveYielded(['A']);
Scheduler.unstable_advanceTime(10000);
ReactNoop.render(<Text text="B" />);
expect(Scheduler).toFlushExpired([]);
});
it('regression: does not expire soon due to previous expired work', () => {
function Text({text}) {
Scheduler.unstable_yieldValue(text);
return text;
}
ReactNoop.render(<Text text="A" />);
Scheduler.unstable_advanceTime(10000);
expect(Scheduler).toFlushExpired(['A']);
Scheduler.unstable_advanceTime(10000);
ReactNoop.render(<Text text="B" />);
expect(Scheduler).toFlushExpired([]);
});
it('when rebasing, does not exclude updates that were already committed, regardless of priority', async () => {
const {useState, useLayoutEffect} = React;