Skip to content

Commit e98695d

Browse files
authored
Codemod tests to waitFor pattern (6/?) (#26305)
This converts some of our test suite to use the `waitFor` test pattern, instead of the `expect(Scheduler).toFlushAndYield` pattern. Most of these changes are automated with jscodeshift, with some slight manual cleanup in certain cases. See #26285 for full context.
1 parent 9a52cc8 commit e98695d

10 files changed

+517
-556
lines changed

packages/react-reconciler/src/__tests__/ReactMemo-test.js

+44-48
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,8 @@ let ReactNoop;
1818
let Suspense;
1919
let Scheduler;
2020
let act;
21+
let waitForAll;
22+
let assertLog;
2123

2224
describe('memo', () => {
2325
beforeEach(() => {
@@ -29,6 +31,10 @@ describe('memo', () => {
2931
Scheduler = require('scheduler');
3032
act = require('jest-react').act;
3133
({Suspense} = React);
34+
35+
const InternalTestUtils = require('internal-test-utils');
36+
waitForAll = InternalTestUtils.waitForAll;
37+
assertLog = InternalTestUtils.assertLog;
3238
});
3339

3440
function Text(props) {
@@ -105,9 +111,7 @@ describe('memo', () => {
105111
<Counter count={0} />
106112
</Suspense>,
107113
);
108-
expect(Scheduler).toFlushAndYield(['Loading...']);
109-
await Promise.resolve();
110-
expect(Scheduler).toFlushAndYield([0]);
114+
await waitForAll(['Loading...', 0]);
111115
expect(ReactNoop).toMatchRenderedOutput(<span prop={0} />);
112116

113117
// Should bail out because props have not changed
@@ -116,7 +120,7 @@ describe('memo', () => {
116120
<Counter count={0} />
117121
</Suspense>,
118122
);
119-
expect(Scheduler).toFlushAndYield([]);
123+
await waitForAll([]);
120124
expect(ReactNoop).toMatchRenderedOutput(<span prop={0} />);
121125

122126
// Should update because count prop changed
@@ -125,7 +129,7 @@ describe('memo', () => {
125129
<Counter count={1} />
126130
</Suspense>,
127131
);
128-
expect(Scheduler).toFlushAndYield([1]);
132+
await waitForAll([1]);
129133
expect(ReactNoop).toMatchRenderedOutput(<span prop={1} />);
130134
});
131135

@@ -160,19 +164,17 @@ describe('memo', () => {
160164

161165
const parent = React.createRef(null);
162166
ReactNoop.render(<Parent ref={parent} />);
163-
expect(Scheduler).toFlushAndYield(['Loading...']);
164-
await Promise.resolve();
165-
expect(Scheduler).toFlushAndYield(['Count: 0']);
167+
await waitForAll(['Loading...', 'Count: 0']);
166168
expect(ReactNoop).toMatchRenderedOutput(<span prop="Count: 0" />);
167169

168170
// Should bail out because props have not changed
169171
ReactNoop.render(<Parent ref={parent} />);
170-
expect(Scheduler).toFlushAndYield([]);
172+
await waitForAll([]);
171173
expect(ReactNoop).toMatchRenderedOutput(<span prop="Count: 0" />);
172174

173175
// Should update because there was a context change
174176
parent.current.setState({count: 1});
175-
expect(Scheduler).toFlushAndYield(['Count: 1']);
177+
await waitForAll(['Count: 1']);
176178
expect(ReactNoop).toMatchRenderedOutput(<span prop="Count: 1" />);
177179
});
178180

@@ -273,7 +275,7 @@ describe('memo', () => {
273275
await act(async () => {
274276
root.render(<App prop="A" />);
275277
});
276-
expect(Scheduler).toHaveYielded([
278+
assertLog([
277279
'SimpleMemo [A0]',
278280
'ComplexMemo [A0]',
279281
'MemoWithIndirection [A0]',
@@ -283,7 +285,7 @@ describe('memo', () => {
283285
await act(async () => {
284286
root.render(<App prop="B" />);
285287
});
286-
expect(Scheduler).toHaveYielded([
288+
assertLog([
287289
'SimpleMemo [B0]',
288290
'ComplexMemo [B0]',
289291
'MemoWithIndirection [B0]',
@@ -298,7 +300,7 @@ describe('memo', () => {
298300
root.render(<App prop="B" />);
299301
});
300302
// Nothing re-renders
301-
expect(Scheduler).toHaveYielded([]);
303+
assertLog([]);
302304

303305
// Demonstrate what happens when the prop object changes, it bails out
304306
// because all the props are the same, but we still render the
@@ -309,7 +311,7 @@ describe('memo', () => {
309311
});
310312
// The components should re-render with the new local state, but none
311313
// of the props objects should have changed
312-
expect(Scheduler).toHaveYielded([
314+
assertLog([
313315
'SimpleMemo [B1]',
314316
'ComplexMemo [B1]',
315317
'MemoWithIndirection [B1]',
@@ -322,7 +324,7 @@ describe('memo', () => {
322324
});
323325
// The components should re-render with the new local state, but none
324326
// of the props objects should have changed
325-
expect(Scheduler).toHaveYielded([
327+
assertLog([
326328
'SimpleMemo [B2]',
327329
'ComplexMemo [B2]',
328330
'MemoWithIndirection [B2]',
@@ -345,9 +347,7 @@ describe('memo', () => {
345347
<Counter count={0} />
346348
</Suspense>,
347349
);
348-
expect(Scheduler).toFlushAndYield(['Loading...']);
349-
await Promise.resolve();
350-
expect(Scheduler).toFlushAndYield([0]);
350+
await waitForAll(['Loading...', 0]);
351351
expect(ReactNoop).toMatchRenderedOutput(<span prop={0} />);
352352

353353
// Should bail out because props have not changed
@@ -356,7 +356,7 @@ describe('memo', () => {
356356
<Counter count={0} />
357357
</Suspense>,
358358
);
359-
expect(Scheduler).toFlushAndYield(['Old count: 0, New count: 0']);
359+
await waitForAll(['Old count: 0, New count: 0']);
360360
expect(ReactNoop).toMatchRenderedOutput(<span prop={0} />);
361361

362362
// Should update because count prop changed
@@ -365,7 +365,7 @@ describe('memo', () => {
365365
<Counter count={1} />
366366
</Suspense>,
367367
);
368-
expect(Scheduler).toFlushAndYield(['Old count: 0, New count: 1', 1]);
368+
await waitForAll(['Old count: 0, New count: 1', 1]);
369369
expect(ReactNoop).toMatchRenderedOutput(<span prop={1} />);
370370
});
371371

@@ -383,9 +383,7 @@ describe('memo', () => {
383383
<Counter count={0} />
384384
</Suspense>,
385385
);
386-
expect(Scheduler).toFlushAndYield(['Loading...']);
387-
await Promise.resolve();
388-
expect(Scheduler).toFlushAndYield(['0!']);
386+
await waitForAll(['Loading...', '0!']);
389387
expect(ReactNoop).toMatchRenderedOutput(<span prop="0!" />);
390388

391389
// Should bail out because props have not changed
@@ -394,7 +392,7 @@ describe('memo', () => {
394392
<Counter count={0} />
395393
</Suspense>,
396394
);
397-
expect(Scheduler).toFlushAndYield([]);
395+
await waitForAll([]);
398396
expect(ReactNoop).toMatchRenderedOutput(<span prop="0!" />);
399397

400398
// Should update because count prop changed
@@ -403,7 +401,7 @@ describe('memo', () => {
403401
<Counter count={1} />
404402
</Suspense>,
405403
);
406-
expect(Scheduler).toFlushAndYield(['1!']);
404+
await waitForAll(['1!']);
407405
expect(ReactNoop).toMatchRenderedOutput(<span prop="1!" />);
408406
});
409407

@@ -436,10 +434,8 @@ describe('memo', () => {
436434
<Counter e={5} />
437435
</Suspense>,
438436
);
439-
expect(Scheduler).toFlushAndYield(['Loading...']);
440-
await Promise.resolve();
441-
expect(() => {
442-
expect(Scheduler).toFlushAndYield([15]);
437+
await expect(async () => {
438+
await waitForAll(['Loading...', 15]);
443439
}).toErrorDev([
444440
'Counter: Support for defaultProps will be removed from memo components in a future major release. Use JavaScript default parameters instead.',
445441
]);
@@ -451,7 +447,7 @@ describe('memo', () => {
451447
<Counter e={5} />
452448
</Suspense>,
453449
);
454-
expect(Scheduler).toFlushAndYield([]);
450+
await waitForAll([]);
455451
expect(ReactNoop).toMatchRenderedOutput(<span prop={15} />);
456452

457453
// Should update because count prop changed
@@ -460,7 +456,7 @@ describe('memo', () => {
460456
<Counter e={10} />
461457
</Suspense>,
462458
);
463-
expect(Scheduler).toFlushAndYield([20]);
459+
await waitForAll([20]);
464460
expect(ReactNoop).toMatchRenderedOutput(<span prop={20} />);
465461
});
466462

@@ -480,57 +476,57 @@ describe('memo', () => {
480476
);
481477
});
482478

483-
it('validates propTypes declared on the inner component', () => {
479+
it('validates propTypes declared on the inner component', async () => {
484480
function FnInner(props) {
485481
return props.inner;
486482
}
487483
FnInner.propTypes = {inner: PropTypes.number.isRequired};
488484
const Fn = React.memo(FnInner);
489485

490486
// Mount
491-
expect(() => {
487+
await expect(async () => {
492488
ReactNoop.render(<Fn inner="2" />);
493-
expect(Scheduler).toFlushWithoutYielding();
489+
await waitForAll([]);
494490
}).toErrorDev(
495491
'Invalid prop `inner` of type `string` supplied to `FnInner`, expected `number`.',
496492
);
497493

498494
// Update
499-
expect(() => {
495+
await expect(async () => {
500496
ReactNoop.render(<Fn inner={false} />);
501-
expect(Scheduler).toFlushWithoutYielding();
497+
await waitForAll([]);
502498
}).toErrorDev(
503499
'Invalid prop `inner` of type `boolean` supplied to `FnInner`, expected `number`.',
504500
);
505501
});
506502

507-
it('validates propTypes declared on the outer component', () => {
503+
it('validates propTypes declared on the outer component', async () => {
508504
function FnInner(props) {
509505
return props.outer;
510506
}
511507
const Fn = React.memo(FnInner);
512508
Fn.propTypes = {outer: PropTypes.number.isRequired};
513509

514510
// Mount
515-
expect(() => {
511+
await expect(async () => {
516512
ReactNoop.render(<Fn outer="3" />);
517-
expect(Scheduler).toFlushWithoutYielding();
513+
await waitForAll([]);
518514
}).toErrorDev(
519515
// Outer props are checked in createElement
520516
'Invalid prop `outer` of type `string` supplied to `FnInner`, expected `number`.',
521517
);
522518

523519
// Update
524-
expect(() => {
520+
await expect(async () => {
525521
ReactNoop.render(<Fn outer={false} />);
526-
expect(Scheduler).toFlushWithoutYielding();
522+
await waitForAll([]);
527523
}).toErrorDev(
528524
// Outer props are checked in createElement
529525
'Invalid prop `outer` of type `boolean` supplied to `FnInner`, expected `number`.',
530526
);
531527
});
532528

533-
it('validates nested propTypes declarations', () => {
529+
it('validates nested propTypes declarations', async () => {
534530
function Inner(props) {
535531
return props.inner + props.middle + props.outer;
536532
}
@@ -549,34 +545,34 @@ describe('memo', () => {
549545
<Outer />
550546
</div>,
551547
);
552-
expect(() => {
553-
expect(Scheduler).toFlushWithoutYielding();
548+
await expect(async () => {
549+
await waitForAll([]);
554550
}).toErrorDev([
555551
'Inner: Support for defaultProps will be removed from memo components in a future major release. Use JavaScript default parameters instead.',
556552
]);
557553

558554
// Mount
559-
expect(() => {
555+
await expect(async () => {
560556
ReactNoop.render(
561557
<div>
562558
<Outer inner="2" middle="3" outer="4" />
563559
</div>,
564560
);
565-
expect(Scheduler).toFlushWithoutYielding();
561+
await waitForAll([]);
566562
}).toErrorDev([
567563
'Invalid prop `outer` of type `string` supplied to `Inner`, expected `number`.',
568564
'Invalid prop `middle` of type `string` supplied to `Inner`, expected `number`.',
569565
'Invalid prop `inner` of type `string` supplied to `Inner`, expected `number`.',
570566
]);
571567

572568
// Update
573-
expect(() => {
569+
await expect(async () => {
574570
ReactNoop.render(
575571
<div>
576572
<Outer inner={false} middle={false} outer={false} />
577573
</div>,
578574
);
579-
expect(Scheduler).toFlushWithoutYielding();
575+
await waitForAll([]);
580576
}).toErrorDev([
581577
'Invalid prop `outer` of type `boolean` supplied to `Inner`, expected `number`.',
582578
'Invalid prop `middle` of type `boolean` supplied to `Inner`, expected `number`.',

0 commit comments

Comments
 (0)