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
jddxf committed
Jun 30, 2020 at 19:42 UTC
fa32cf299f514a0daa5ccd16fd8595b5cc6bc18b
1 file changed
+64
packages/react-reconciler/src/__tests__/ReactIncrementalUpdates-test.js
+64
@@ -438,6 +438,70 @@ describe('ReactIncrementalUpdates', () => {
438
expect(ReactNoop.getChildren()).toEqual([span('derived state')]);
439
});
440
441
+ it('regression: does not expire soon due to layout effects in the last batch', () => {
442
+ const {useState, useLayoutEffect} = React;
443
+
444
+ let setCount;
445
+ function App() {
446
+ const [count, _setCount] = useState(0);
447
+ setCount = _setCount;
448
+ Scheduler.unstable_yieldValue('Render: ' + count);
449
+ useLayoutEffect(() => {
450
+ setCount(prevCount => prevCount + 1);
451
+ Scheduler.unstable_yieldValue('Commit: ' + count);
452
+ }, []);
453
+ return null;
454
+ }
455
+
456
+ ReactNoop.act(() => {
457
+ ReactNoop.render(<App />);
458
+ expect(Scheduler).toFlushExpired([]);
459
+ expect(Scheduler).toFlushAndYield([
460
+ 'Render: 0',
461
+ 'Commit: 0',
462
+ 'Render: 1',
463
+ ]);
464
+
465
+ Scheduler.unstable_advanceTime(10000);
466
+
467
+ setCount(2);
468
+ expect(Scheduler).toFlushExpired([]);
469
+ });
470
+ });
471
+
472
+ it('regression: does not expire soon due to previous flushSync', () => {
473
+ function Text({text}) {
474
+ Scheduler.unstable_yieldValue(text);
475
+ return text;
476
+ }
477
+
478
+ ReactNoop.flushSync(() => {
479
+ ReactNoop.render(<Text text="A" />);
480
+ });
481
+ expect(Scheduler).toHaveYielded(['A']);
482
+
483
+ Scheduler.unstable_advanceTime(10000);
484
+
485
+ ReactNoop.render(<Text text="B" />);
486
+ expect(Scheduler).toFlushExpired([]);
487
+ });
488
+
489
+ it('regression: does not expire soon due to previous expired work', () => {
490
+ function Text({text}) {
491
+ Scheduler.unstable_yieldValue(text);
492
+ return text;
493
+ }
494
+
495
+ ReactNoop.render(<Text text="A" />);
496
+ Scheduler.unstable_advanceTime(10000);
497
+ expect(Scheduler).toFlushExpired(['A']);
498
+
499
+ Scheduler.unstable_advanceTime(10000);
500
+
501
+ ReactNoop.render(<Text text="B" />);
502
+ expect(Scheduler).toFlushExpired([]);
503
+ });
504
+
505
it('when rebasing, does not exclude updates that were already committed, regardless of priority', async () => {
506
const {useState, useLayoutEffect} = React;
507