Skip to content

Commit 64dde70

Browse files
authored
Codemod tests to waitFor pattern (8/?) (#26308)
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 3cb5afb commit 64dde70

File tree

17 files changed

+591
-557
lines changed

17 files changed

+591
-557
lines changed

packages/react-devtools-shared/src/__tests__/preprocessData-test.js

Lines changed: 30 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,8 @@ describe('Timeline profiler', () => {
1717
let ReactDOMClient;
1818
let Scheduler;
1919
let utils;
20+
let assertLog;
21+
let waitFor;
2022

2123
describe('User Timing API', () => {
2224
let clearedMarks;
@@ -82,6 +84,10 @@ describe('Timeline profiler', () => {
8284
ReactDOMClient = require('react-dom/client');
8385
Scheduler = require('scheduler');
8486

87+
const InternalTestUtils = require('internal-test-utils');
88+
assertLog = InternalTestUtils.assertLog;
89+
waitFor = InternalTestUtils.waitFor;
90+
8591
setPerformanceMock =
8692
require('react-devtools-shared/src/backend/profilingHooks').setPerformanceMock_ONLY_FOR_TESTING;
8793
setPerformanceMock(createUserTimingPolyfill());
@@ -1372,28 +1378,29 @@ describe('Timeline profiler', () => {
13721378
<Yield id="B" value={1} />
13731379
</>,
13741380
);
1375-
expect(Scheduler).toFlushAndYieldThrough(['A:1']);
1381+
});
13761382

1377-
testMarks.push(...createUserTimingData(clearedMarks));
1378-
clearPendingMarks();
1383+
await waitFor(['A:1']);
13791384

1380-
// Advance the clock some more to make the pending React update seem long.
1381-
startTime += 20000;
1385+
testMarks.push(...createUserTimingData(clearedMarks));
1386+
clearPendingMarks();
13821387

1383-
// Fake a long "click" event in the middle
1384-
// and schedule a sync update that will also flush the previous work.
1385-
testMarks.push(createNativeEventEntry('click', 25000));
1386-
ReactDOM.flushSync(() => {
1387-
root.render(
1388-
<>
1389-
<Yield id="A" value={2} />
1390-
<Yield id="B" value={2} />
1391-
</>,
1392-
);
1393-
});
1388+
// Advance the clock some more to make the pending React update seem long.
1389+
startTime += 20000;
1390+
1391+
// Fake a long "click" event in the middle
1392+
// and schedule a sync update that will also flush the previous work.
1393+
testMarks.push(createNativeEventEntry('click', 25000));
1394+
ReactDOM.flushSync(() => {
1395+
root.render(
1396+
<>
1397+
<Yield id="A" value={2} />
1398+
<Yield id="B" value={2} />
1399+
</>,
1400+
);
13941401
});
13951402

1396-
expect(Scheduler).toHaveYielded(['A:2', 'B:2']);
1403+
assertLog(['A:2', 'B:2']);
13971404

13981405
testMarks.push(...createUserTimingData(clearedMarks));
13991406

@@ -1424,10 +1431,7 @@ describe('Timeline profiler', () => {
14241431
root.render(<Component />);
14251432
});
14261433

1427-
expect(Scheduler).toHaveYielded([
1428-
'Component mount',
1429-
'Component update',
1430-
]);
1434+
assertLog(['Component mount', 'Component update']);
14311435

14321436
const data = await preprocessData([
14331437
...createBoilerplateEntries(),
@@ -1463,10 +1467,7 @@ describe('Timeline profiler', () => {
14631467
root.render(<Component />);
14641468
});
14651469

1466-
expect(Scheduler).toHaveYielded([
1467-
'Component mount',
1468-
'Component update',
1469-
]);
1470+
assertLog(['Component mount', 'Component update']);
14701471

14711472
const data = await preprocessData([
14721473
...createBoilerplateEntries(),
@@ -1504,10 +1505,7 @@ describe('Timeline profiler', () => {
15041505
root.render(<Component />);
15051506
});
15061507

1507-
expect(Scheduler).toHaveYielded([
1508-
'Component mount',
1509-
'Component update',
1510-
]);
1508+
assertLog(['Component mount', 'Component update']);
15111509

15121510
const testMarks = [];
15131511
clearedMarks.forEach(markName => {
@@ -1567,10 +1565,7 @@ describe('Timeline profiler', () => {
15671565
root.render(<Component />);
15681566
});
15691567

1570-
expect(Scheduler).toHaveYielded([
1571-
'Component mount',
1572-
'Component update',
1573-
]);
1568+
assertLog(['Component mount', 'Component update']);
15741569

15751570
const testMarks = [];
15761571
clearedMarks.forEach(markName => {
@@ -1639,7 +1634,7 @@ describe('Timeline profiler', () => {
16391634
root.render(<Component />);
16401635
});
16411636

1642-
expect(Scheduler).toHaveYielded([
1637+
assertLog([
16431638
'Component rendered with value 0',
16441639
'Component rendered with value 0',
16451640
'Component rendered with value 1',
@@ -1708,7 +1703,7 @@ describe('Timeline profiler', () => {
17081703
root.render(<Component />);
17091704
});
17101705

1711-
expect(Scheduler).toHaveYielded([
1706+
assertLog([
17121707
'Component rendered with value 0 and deferredValue 0',
17131708
'Component rendered with value 1 and deferredValue 0',
17141709
'Component rendered with value 1 and deferredValue 1',

packages/react-dom/src/__tests__/ReactDOMFizzShellHydration-test.js

Lines changed: 14 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,7 @@ let buffer = '';
2323
let hasErrored = false;
2424
let fatalError = undefined;
2525
let textCache;
26+
let assertLog;
2627

2728
describe('ReactDOMFizzShellHydration', () => {
2829
beforeEach(() => {
@@ -35,6 +36,9 @@ describe('ReactDOMFizzShellHydration', () => {
3536
ReactDOMFizzServer = require('react-dom/server');
3637
Stream = require('stream');
3738

39+
const InternalTestUtils = require('internal-test-utils');
40+
assertLog = InternalTestUtils.assertLog;
41+
3842
startTransition = React.startTransition;
3943

4044
textCache = new Map();
@@ -180,7 +184,7 @@ describe('ReactDOMFizzShellHydration', () => {
180184
const {pipe} = ReactDOMFizzServer.renderToPipeableStream(<App />);
181185
pipe(writable);
182186
});
183-
expect(Scheduler).toHaveYielded(['Shell']);
187+
assertLog(['Shell']);
184188
const dehydratedDiv = container.getElementsByTagName('div')[0];
185189

186190
// Clear the cache and start rendering on the client
@@ -190,15 +194,15 @@ describe('ReactDOMFizzShellHydration', () => {
190194
await clientAct(async () => {
191195
ReactDOMClient.hydrateRoot(container, <App />);
192196
});
193-
expect(Scheduler).toHaveYielded(['Suspend! [Shell]']);
197+
assertLog(['Suspend! [Shell]']);
194198
expect(div.current).toBe(null);
195199
expect(container.textContent).toBe('Shell');
196200

197201
// The shell loads and hydration finishes
198202
await clientAct(async () => {
199203
await resolveText('Shell');
200204
});
201-
expect(Scheduler).toHaveYielded(['Shell']);
205+
assertLog(['Shell']);
202206
expect(div.current).toBe(dehydratedDiv);
203207
expect(container.textContent).toBe('Shell');
204208
});
@@ -213,12 +217,12 @@ describe('ReactDOMFizzShellHydration', () => {
213217
await clientAct(async () => {
214218
root.render(<App />);
215219
});
216-
expect(Scheduler).toHaveYielded(['Suspend! [Shell]']);
220+
assertLog(['Suspend! [Shell]']);
217221

218222
await clientAct(async () => {
219223
await resolveText('Shell');
220224
});
221-
expect(Scheduler).toHaveYielded(['Shell']);
225+
assertLog(['Shell']);
222226
expect(container.textContent).toBe('Shell');
223227
});
224228

@@ -236,7 +240,7 @@ describe('ReactDOMFizzShellHydration', () => {
236240
const {pipe} = ReactDOMFizzServer.renderToPipeableStream(<App />);
237241
pipe(writable);
238242
});
239-
expect(Scheduler).toHaveYielded(['Initial']);
243+
assertLog(['Initial']);
240244

241245
await clientAct(async () => {
242246
const root = ReactDOMClient.hydrateRoot(container, <App />);
@@ -246,7 +250,7 @@ describe('ReactDOMFizzShellHydration', () => {
246250
root.render(<Text text="Updated" />);
247251
});
248252
});
249-
expect(Scheduler).toHaveYielded(['Initial', 'Updated']);
253+
assertLog(['Initial', 'Updated']);
250254
expect(container.textContent).toBe('Updated');
251255
},
252256
);
@@ -262,7 +266,7 @@ describe('ReactDOMFizzShellHydration', () => {
262266
const {pipe} = ReactDOMFizzServer.renderToPipeableStream(<App />);
263267
pipe(writable);
264268
});
265-
expect(Scheduler).toHaveYielded(['Shell']);
269+
assertLog(['Shell']);
266270

267271
// Clear the cache and start rendering on the client
268272
resetTextCache();
@@ -275,13 +279,13 @@ describe('ReactDOMFizzShellHydration', () => {
275279
},
276280
});
277281
});
278-
expect(Scheduler).toHaveYielded(['Suspend! [Shell]']);
282+
assertLog(['Suspend! [Shell]']);
279283
expect(container.textContent).toBe('Shell');
280284

281285
await clientAct(async () => {
282286
root.render(<Text text="New screen" />);
283287
});
284-
expect(Scheduler).toHaveYielded([
288+
assertLog([
285289
'New screen',
286290
'This root received an early update, before anything was able ' +
287291
'hydrate. Switched the entire root to client rendering.',

0 commit comments

Comments
 (0)
pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy