Skip to content

Commit 3cb5afb

Browse files
acdliteacdlite
authored
Codemod tests to waitFor pattern (7/?) (#26307)
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 e98695d commit 3cb5afb

14 files changed

+635
-737
lines changed

‎packages/react-reconciler/src/__tests__/ReactSuspenseEffectsSemanticsDOM-test.js‎

Lines changed: 29 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,8 @@ let ReactDOMClient;
1515
let Scheduler;
1616
let act;
1717
let container;
18+
let waitForAll;
19+
let assertLog;
1820

1921
describe('ReactSuspenseEffectsSemanticsDOM', () => {
2022
beforeEach(() => {
@@ -26,6 +28,10 @@ describe('ReactSuspenseEffectsSemanticsDOM', () => {
2628
Scheduler = require('scheduler');
2729
act = require('jest-react').act;
2830

31+
const InternalTestUtils = require('internal-test-utils');
32+
waitForAll = InternalTestUtils.waitForAll;
33+
assertLog = InternalTestUtils.assertLog;
34+
2935
container = document.createElement('div');
3036
document.body.appendChild(container);
3137
});
@@ -139,23 +145,23 @@ describe('ReactSuspenseEffectsSemanticsDOM', () => {
139145
act(() => {
140146
root.render(<Parent swap={false} />);
141147
});
142-
expect(Scheduler).toHaveYielded(['Loading...']);
148+
assertLog(['Loading...']);
143149

144150
await LazyChildA;
145-
expect(Scheduler).toFlushAndYield(['A', 'Ref mount: A']);
151+
await waitForAll(['A', 'Ref mount: A']);
146152
expect(container.innerHTML).toBe('<span>A</span>');
147153

148154
// Swap the position of A and B
149155
ReactDOM.flushSync(() => {
150156
root.render(<Parent swap={true} />);
151157
});
152-
expect(Scheduler).toHaveYielded(['Loading...', 'Ref unmount: A']);
158+
assertLog(['Loading...', 'Ref unmount: A']);
153159
expect(container.innerHTML).toBe(
154160
'<span style="display: none;">A</span>Loading...',
155161
);
156162

157163
await LazyChildB;
158-
expect(Scheduler).toFlushAndYield(['B', 'Ref mount: B']);
164+
await waitForAll(['B', 'Ref mount: B']);
159165
expect(container.innerHTML).toBe('<span>B</span>');
160166
});
161167

@@ -199,21 +205,21 @@ describe('ReactSuspenseEffectsSemanticsDOM', () => {
199205
act(() => {
200206
root.render(<Parent swap={false} />);
201207
});
202-
expect(Scheduler).toHaveYielded(['Loading...']);
208+
assertLog(['Loading...']);
203209

204210
await LazyChildA;
205-
expect(Scheduler).toFlushAndYield(['A', 'Did mount: A']);
211+
await waitForAll(['A', 'Did mount: A']);
206212
expect(container.innerHTML).toBe('A');
207213

208214
// Swap the position of A and B
209215
ReactDOM.flushSync(() => {
210216
root.render(<Parent swap={true} />);
211217
});
212-
expect(Scheduler).toHaveYielded(['Loading...', 'Will unmount: A']);
218+
assertLog(['Loading...', 'Will unmount: A']);
213219
expect(container.innerHTML).toBe('Loading...');
214220

215221
await LazyChildB;
216-
expect(Scheduler).toFlushAndYield(['B', 'Did mount: B']);
222+
await waitForAll(['B', 'Did mount: B']);
217223
expect(container.innerHTML).toBe('B');
218224
});
219225

@@ -251,24 +257,24 @@ describe('ReactSuspenseEffectsSemanticsDOM', () => {
251257
act(() => {
252258
root.render(<Parent swap={false} />);
253259
});
254-
expect(Scheduler).toHaveYielded(['Loading...']);
260+
assertLog(['Loading...']);
255261

256262
await LazyChildA;
257-
expect(Scheduler).toFlushAndYield(['A', 'Did mount: A']);
263+
await waitForAll(['A', 'Did mount: A']);
258264
expect(container.innerHTML).toBe('A');
259265

260266
// Swap the position of A and B
261267
ReactDOM.flushSync(() => {
262268
root.render(<Parent swap={true} />);
263269
});
264-
expect(Scheduler).toHaveYielded(['Loading...', 'Will unmount: A']);
270+
assertLog(['Loading...', 'Will unmount: A']);
265271
expect(container.innerHTML).toBe('Loading...');
266272

267273
// Destroy the whole tree, including the hidden A
268274
ReactDOM.flushSync(() => {
269275
root.render(<h1>Hello</h1>);
270276
});
271-
expect(Scheduler).toFlushAndYield([]);
277+
await waitForAll([]);
272278
expect(container.innerHTML).toBe('<h1>Hello</h1>');
273279
});
274280

@@ -318,17 +324,17 @@ describe('ReactSuspenseEffectsSemanticsDOM', () => {
318324
act(() => {
319325
root.render(<Parent swap={false} />);
320326
});
321-
expect(Scheduler).toHaveYielded(['Loading...']);
327+
assertLog(['Loading...']);
322328

323329
await LazyChildA;
324-
expect(Scheduler).toFlushAndYield(['A', 'Ref mount: A']);
330+
await waitForAll(['A', 'Ref mount: A']);
325331
expect(container.innerHTML).toBe('<span>A</span>');
326332

327333
// Swap the position of A and B
328334
ReactDOM.flushSync(() => {
329335
root.render(<Parent swap={true} />);
330336
});
331-
expect(Scheduler).toHaveYielded(['Loading...', 'Ref unmount: A']);
337+
assertLog(['Loading...', 'Ref unmount: A']);
332338
expect(container.innerHTML).toBe(
333339
'<span style="display: none;">A</span>Loading...',
334340
);
@@ -337,7 +343,7 @@ describe('ReactSuspenseEffectsSemanticsDOM', () => {
337343
ReactDOM.flushSync(() => {
338344
root.render(<h1>Hello</h1>);
339345
});
340-
expect(Scheduler).toFlushAndYield([]);
346+
await waitForAll([]);
341347
expect(container.innerHTML).toBe('<h1>Hello</h1>');
342348
});
343349

@@ -381,24 +387,24 @@ describe('ReactSuspenseEffectsSemanticsDOM', () => {
381387
act(() => {
382388
root.render(<Parent swap={false} />);
383389
});
384-
expect(Scheduler).toHaveYielded(['Loading...']);
390+
assertLog(['Loading...']);
385391

386392
await LazyChildA;
387-
expect(Scheduler).toFlushAndYield(['A', 'Did mount: A']);
393+
await waitForAll(['A', 'Did mount: A']);
388394
expect(container.innerHTML).toBe('A');
389395

390396
// Swap the position of A and B
391397
ReactDOM.flushSync(() => {
392398
root.render(<Parent swap={true} />);
393399
});
394-
expect(Scheduler).toHaveYielded(['Loading...', 'Will unmount: A']);
400+
assertLog(['Loading...', 'Will unmount: A']);
395401
expect(container.innerHTML).toBe('Loading...');
396402

397403
// Destroy the whole tree, including the hidden A
398404
ReactDOM.flushSync(() => {
399405
root.render(<h1>Hello</h1>);
400406
});
401-
expect(Scheduler).toFlushAndYield([]);
407+
await waitForAll([]);
402408
expect(container.innerHTML).toBe('<h1>Hello</h1>');
403409
});
404410

@@ -432,12 +438,12 @@ describe('ReactSuspenseEffectsSemanticsDOM', () => {
432438

433439
// Initial render
434440
ReactDOM.render(<App showMore={false} />, container);
435-
expect(Scheduler).toHaveYielded(['Child', 'Mount']);
441+
assertLog(['Child', 'Mount']);
436442

437443
// Update that suspends, causing the existing tree to switches it to
438444
// a fallback.
439445
ReactDOM.render(<App showMore={true} />, container);
440-
expect(Scheduler).toHaveYielded([
446+
assertLog([
441447
'Child',
442448
'Loading...',
443449

@@ -448,6 +454,6 @@ describe('ReactSuspenseEffectsSemanticsDOM', () => {
448454

449455
// Delete the tree and unmount the effect
450456
ReactDOM.render(null, container);
451-
expect(Scheduler).toHaveYielded(['Unmount']);
457+
assertLog(['Unmount']);
452458
});
453459
});

‎packages/react-reconciler/src/__tests__/ReactSuspenseFallback-test.js‎

Lines changed: 16 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@ let Suspense;
1313
let getCacheForType;
1414
let caches;
1515
let seededCache;
16+
let waitForAll;
1617

1718
describe('ReactSuspenseFallback', () => {
1819
beforeEach(() => {
@@ -25,6 +26,9 @@ describe('ReactSuspenseFallback', () => {
2526
getCacheForType = React.unstable_getCacheForType;
2627
caches = [];
2728
seededCache = null;
29+
30+
const InternalTestUtils = require('internal-test-utils');
31+
waitForAll = InternalTestUtils.waitForAll;
2832
});
2933

3034
function createTextCache() {
@@ -128,49 +132,49 @@ describe('ReactSuspenseFallback', () => {
128132
}
129133

130134
// @gate enableLegacyCache
131-
it('suspends and shows fallback', () => {
135+
it('suspends and shows fallback', async () => {
132136
ReactNoop.render(
133137
<Suspense fallback={<Text text="Loading..." />}>
134138
<AsyncText text="A" ms={100} />
135139
</Suspense>,
136140
);
137141

138-
expect(Scheduler).toFlushAndYield(['Suspend! [A]', 'Loading...']);
142+
await waitForAll(['Suspend! [A]', 'Loading...']);
139143
expect(ReactNoop).toMatchRenderedOutput(<span prop="Loading..." />);
140144
});
141145

142146
// @gate enableLegacyCache
143-
it('suspends and shows null fallback', () => {
147+
it('suspends and shows null fallback', async () => {
144148
ReactNoop.render(
145149
<Suspense fallback={null}>
146150
<AsyncText text="A" ms={100} />
147151
</Suspense>,
148152
);
149153

150-
expect(Scheduler).toFlushAndYield([
154+
await waitForAll([
151155
'Suspend! [A]',
152156
// null
153157
]);
154158
expect(ReactNoop).toMatchRenderedOutput(null);
155159
});
156160

157161
// @gate enableLegacyCache
158-
it('suspends and shows undefined fallback', () => {
162+
it('suspends and shows undefined fallback', async () => {
159163
ReactNoop.render(
160164
<Suspense>
161165
<AsyncText text="A" ms={100} />
162166
</Suspense>,
163167
);
164168

165-
expect(Scheduler).toFlushAndYield([
169+
await waitForAll([
166170
'Suspend! [A]',
167171
// null
168172
]);
169173
expect(ReactNoop).toMatchRenderedOutput(null);
170174
});
171175

172176
// @gate enableLegacyCache
173-
it('suspends and shows inner fallback', () => {
177+
it('suspends and shows inner fallback', async () => {
174178
ReactNoop.render(
175179
<Suspense fallback={<Text text="Should not show..." />}>
176180
<Suspense fallback={<Text text="Loading..." />}>
@@ -179,12 +183,12 @@ describe('ReactSuspenseFallback', () => {
179183
</Suspense>,
180184
);
181185

182-
expect(Scheduler).toFlushAndYield(['Suspend! [A]', 'Loading...']);
186+
await waitForAll(['Suspend! [A]', 'Loading...']);
183187
expect(ReactNoop).toMatchRenderedOutput(<span prop="Loading..." />);
184188
});
185189

186190
// @gate enableLegacyCache
187-
it('suspends and shows inner undefined fallback', () => {
191+
it('suspends and shows inner undefined fallback', async () => {
188192
ReactNoop.render(
189193
<Suspense fallback={<Text text="Should not show..." />}>
190194
<Suspense>
@@ -193,15 +197,15 @@ describe('ReactSuspenseFallback', () => {
193197
</Suspense>,
194198
);
195199

196-
expect(Scheduler).toFlushAndYield([
200+
await waitForAll([
197201
'Suspend! [A]',
198202
// null
199203
]);
200204
expect(ReactNoop).toMatchRenderedOutput(null);
201205
});
202206

203207
// @gate enableLegacyCache
204-
it('suspends and shows inner null fallback', () => {
208+
it('suspends and shows inner null fallback', async () => {
205209
ReactNoop.render(
206210
<Suspense fallback={<Text text="Should not show..." />}>
207211
<Suspense fallback={null}>
@@ -210,7 +214,7 @@ describe('ReactSuspenseFallback', () => {
210214
</Suspense>,
211215
);
212216

213-
expect(Scheduler).toFlushAndYield([
217+
await waitForAll([
214218
'Suspend! [A]',
215219
// null
216220
]);

0 commit comments

Comments
 (0)