Remove RTR from DebugTracing-test (#28411)
## Summary Internal cleanup of ReactTestRenderer ## How did you test this change? `yarn test packages/react-reconciler/src/__tests__/DebugTracing-test.internal.js`
Jack Pope committed
Mar 7, 2024 at 16:36 UTC
338dddc089d5865761219f02b5175db85c54c489
1 file changed
+59
-64
packages/react-reconciler/src/__tests__/DebugTracing-test.internal.js
+59
-64
@@ -11,9 +11,10 @@
11
12
describe('DebugTracing', () => {
13
let React;
14
- let ReactTestRenderer;
14
+ let ReactNoop;
15
let waitForPaint;
16
let waitForAll;
17
+ let act;
18
19
let logs;
20
@@ -27,10 +28,11 @@ describe('DebugTracing', () => {
28
jest.resetModules();
29
30
React = require('react');
30
- ReactTestRenderer = require('react-test-renderer');
31
+ ReactNoop = require('react-noop-renderer');
32
const InternalTestUtils = require('internal-test-utils');
33
waitForPaint = InternalTestUtils.waitForPaint;
34
waitForAll = InternalTestUtils.waitForAll;
35
+ act = InternalTestUtils.act;
36
37
logs = [];
38
@@ -50,31 +52,32 @@ describe('DebugTracing', () => {
52
});
53
54
// @gate enableDebugTracing
53
- it('should not log anything for sync render without suspends or state updates', () => {
54
- ReactTestRenderer.create(
55
- <React.unstable_DebugTracingMode>
56
- <div />
57
- </React.unstable_DebugTracingMode>,
58
- );
55
+ it('should not log anything for sync render without suspends or state updates', async () => {
56
+ await act(() => {
57
+ ReactNoop.render(
58
+ <React.unstable_DebugTracingMode>
59
+ <div />
60
+ </React.unstable_DebugTracingMode>,
61
+ );
62
+ });
63
64
expect(logs).toEqual([]);
65
});
66
63
- // @gate experimental && build === 'development' && enableDebugTracing
64
- it('should not log anything for concurrent render without suspends or state updates', () => {
65
- ReactTestRenderer.act(() =>
66
- ReactTestRenderer.create(
67
+ // @gate experimental && enableDebugTracing
68
+ it('should not log anything for concurrent render without suspends or state updates', async () => {
69
+ await act(() =>
70
+ ReactNoop.render(
71
<React.unstable_DebugTracingMode>
72
<div />
73
</React.unstable_DebugTracingMode>,
70
- {isConcurrent: true},
74
),
75
);
76
expect(logs).toEqual([]);
77
});
78
79
// @gate experimental && build === 'development' && enableDebugTracing
77
- it('should log sync render with suspense', async () => {
80
+ it('should log sync render with suspense, legacy', async () => {
81
let resolveFakeSuspensePromise;
82
let didResolve = false;
83
const fakeSuspensePromise = new Promise(resolve => {
@@ -91,14 +94,12 @@ describe('DebugTracing', () => {
94
return null;
95
}
96
94
- ReactTestRenderer.act(() =>
95
- ReactTestRenderer.create(
96
- <React.unstable_DebugTracingMode>
97
- <React.Suspense fallback={null}>
98
- <Example />
99
- </React.Suspense>
100
- </React.unstable_DebugTracingMode>,
101
- ),
97
+ ReactNoop.renderLegacySyncRoot(
98
+ <React.unstable_DebugTracingMode>
99
+ <React.Suspense fallback={null}>
100
+ <Example />
101
+ </React.Suspense>
102
+ </React.unstable_DebugTracingMode>,
103
);
104
105
expect(logs).toEqual([
@@ -116,7 +117,7 @@ describe('DebugTracing', () => {
117
});
118
119
// @gate experimental && build === 'development' && enableDebugTracing && enableCPUSuspense
119
- it('should log sync render with CPU suspense', async () => {
120
+ it('should log sync render with CPU suspense, legacy', async () => {
121
function Example() {
122
console.log('<Example/>');
123
return null;
@@ -127,7 +128,7 @@ describe('DebugTracing', () => {
128
return children;
129
}
130
130
- ReactTestRenderer.create(
131
+ ReactNoop.renderLegacySyncRoot(
132
<React.unstable_DebugTracingMode>
133
<Wrapper>
134
<React.Suspense fallback={null} unstable_expectedLoadTime={1}>
@@ -172,14 +173,13 @@ describe('DebugTracing', () => {
173
return null;
174
}
175
175
- ReactTestRenderer.act(() =>
176
- ReactTestRenderer.create(
176
+ await act(() =>
177
+ ReactNoop.render(
178
<React.unstable_DebugTracingMode>
179
<React.Suspense fallback={null}>
180
<Example />
181
</React.Suspense>
182
</React.unstable_DebugTracingMode>,
182
- {isConcurrent: true},
183
),
184
);
185
@@ -191,12 +191,12 @@ describe('DebugTracing', () => {
191
192
logs.splice(0);
193
194
- await ReactTestRenderer.act(async () => await resolveFakeSuspensePromise());
194
+ await act(async () => await resolveFakeSuspensePromise());
195
expect(logs).toEqual(['log: ⚛️ Example resolved']);
196
});
197
198
// @gate experimental && build === 'development' && enableDebugTracing && enableCPUSuspense
199
- it('should log concurrent render with CPU suspense', () => {
199
+ it('should log concurrent render with CPU suspense', async () => {
200
function Example() {
201
console.log('<Example/>');
202
return null;
@@ -207,8 +207,8 @@ describe('DebugTracing', () => {
207
return children;
208
}
209
210
- ReactTestRenderer.act(() =>
211
- ReactTestRenderer.create(
210
+ await act(() =>
211
+ ReactNoop.render(
212
<React.unstable_DebugTracingMode>
213
<Wrapper>
214
<React.Suspense fallback={null} unstable_expectedLoadTime={1}>
@@ -216,7 +216,6 @@ describe('DebugTracing', () => {
216
</React.Suspense>
217
</Wrapper>
218
</React.unstable_DebugTracingMode>,
219
- {isConcurrent: true},
219
),
220
);
221
@@ -231,7 +230,7 @@ describe('DebugTracing', () => {
230
});
231
232
// @gate experimental && build === 'development' && enableDebugTracing
234
- it('should log cascading class component updates', () => {
233
+ it('should log cascading class component updates', async () => {
234
class Example extends React.Component {
235
state = {didMount: false};
236
componentDidMount() {
@@ -242,12 +241,11 @@ describe('DebugTracing', () => {
241
}
242
}
243
245
- ReactTestRenderer.act(() =>
246
- ReactTestRenderer.create(
244
+ await act(() =>
245
+ ReactNoop.render(
246
<React.unstable_DebugTracingMode>
247
<Example />
248
</React.unstable_DebugTracingMode>,
250
- {isConcurrent: true},
249
),
250
);
251
@@ -261,7 +259,7 @@ describe('DebugTracing', () => {
259
});
260
261
// @gate experimental && build === 'development' && enableDebugTracing
264
- it('should log render phase state updates for class component', () => {
262
+ it('should log render phase state updates for class component', async () => {
263
class Example extends React.Component {
264
state = {didRender: false};
265
render() {
@@ -272,16 +270,17 @@ describe('DebugTracing', () => {
270
}
271
}
272
275
- expect(() => {
276
- ReactTestRenderer.act(() =>
277
- ReactTestRenderer.create(
273
+ await expect(async () => {
274
+ await act(() => {
275
+ ReactNoop.render(
276
<React.unstable_DebugTracingMode>
277
<Example />
278
</React.unstable_DebugTracingMode>,
281
- {isConcurrent: true},
282
- ),
283
- );
284
- }).toErrorDev('Cannot update during an existing state transition');
279
+ );
280
+ });
281
+ }).toErrorDev(
282
+ 'Warning: Cannot update during an existing state transition (such as within `render`). Render methods should be a pure function of props and state.',
283
+ );
284
285
expect(logs).toEqual([
286
`group: ⚛️ render (${DEFAULT_LANE_STRING})`,
@@ -291,7 +290,7 @@ describe('DebugTracing', () => {
290
});
291
292
// @gate experimental && build === 'development' && enableDebugTracing
294
- it('should log cascading layout updates', () => {
293
+ it('should log cascading layout updates', async () => {
294
function Example() {
295
const [didMount, setDidMount] = React.useState(false);
296
React.useLayoutEffect(() => {
@@ -300,12 +299,11 @@ describe('DebugTracing', () => {
299
return didMount;
300
}
301
303
- ReactTestRenderer.act(() =>
304
- ReactTestRenderer.create(
302
+ await act(() =>
303
+ ReactNoop.render(
304
<React.unstable_DebugTracingMode>
305
<Example />
306
</React.unstable_DebugTracingMode>,
308
- {isConcurrent: true},
307
),
308
);
309
@@ -319,7 +317,7 @@ describe('DebugTracing', () => {
317
});
318
319
// @gate experimental && build === 'development' && enableDebugTracing
322
- it('should log cascading passive updates', () => {
320
+ it('should log cascading passive updates', async () => {
321
function Example() {
322
const [didMount, setDidMount] = React.useState(false);
323
React.useEffect(() => {
@@ -328,12 +326,11 @@ describe('DebugTracing', () => {
326
return didMount;
327
}
328
331
- ReactTestRenderer.act(() => {
332
- ReactTestRenderer.create(
329
+ await act(() => {
330
+ ReactNoop.render(
331
<React.unstable_DebugTracingMode>
332
<Example />
333
</React.unstable_DebugTracingMode>,
336
- {isConcurrent: true},
334
);
335
});
336
expect(logs).toEqual([
@@ -344,7 +341,7 @@ describe('DebugTracing', () => {
341
});
342
343
// @gate experimental && build === 'development' && enableDebugTracing
347
- it('should log render phase updates', () => {
344
+ it('should log render phase updates', async () => {
345
function Example() {
346
const [didRender, setDidRender] = React.useState(false);
347
if (!didRender) {
@@ -353,12 +350,11 @@ describe('DebugTracing', () => {
350
return didRender;
351
}
352
356
- ReactTestRenderer.act(() => {
357
- ReactTestRenderer.create(
353
+ await act(() => {
354
+ ReactNoop.render(
355
<React.unstable_DebugTracingMode>
356
<Example />
357
</React.unstable_DebugTracingMode>,
361
- {isConcurrent: true},
358
);
359
});
360
@@ -370,18 +366,17 @@ describe('DebugTracing', () => {
366
});
367
368
// @gate experimental && build === 'development' && enableDebugTracing
373
- it('should log when user code logs', () => {
369
+ it('should log when user code logs', async () => {
370
function Example() {
371
console.log('Hello from user code');
372
return null;
373
}
374
379
- ReactTestRenderer.act(() =>
380
- ReactTestRenderer.create(
375
+ await act(() =>
376
+ ReactNoop.render(
377
<React.unstable_DebugTracingMode>
378
<Example />
379
</React.unstable_DebugTracingMode>,
384
- {isConcurrent: true},
380
),
381
);
382
@@ -392,8 +387,8 @@ describe('DebugTracing', () => {
387
]);
388
});
389
395
- // @gate experimental && build === 'development' && enableDebugTracing
396
- it('should not log anything outside of a unstable_DebugTracingMode subtree', () => {
390
+ // @gate experimental && enableDebugTracing
391
+ it('should not log anything outside of a unstable_DebugTracingMode subtree', async () => {
392
function ExampleThatCascades() {
393
const [didMount, setDidMount] = React.useState(false);
394
React.useLayoutEffect(() => {
@@ -412,8 +407,8 @@ describe('DebugTracing', () => {
407
return null;
408
}
409
415
- ReactTestRenderer.act(() =>
416
- ReactTestRenderer.create(
410
+ await act(() =>
411
+ ReactNoop.render(
412
<React.Fragment>
413
<ExampleThatCascades />
414
<React.Suspense fallback={null}>