chore: use versioned render in profilerStore test (#28238)
Ruslan Lesiutin committed
Feb 5, 2024 at 17:20 UTC
49d89b149746094c18da7f24c42b906aceb4e040
1 file changed
+20
-41
packages/react-devtools-shared/src/__tests__/profilerStore-test.js
+20
-41
@@ -9,10 +9,10 @@
9
10
import type Store from 'react-devtools-shared/src/devtools/store';
11
12
+import {getVersionedRenderImplementation} from './utils';
13
+
14
describe('ProfilerStore', () => {
15
let React;
14
- let ReactDOM;
15
- let legacyRender;
16
let store: Store;
17
let utils;
18
@@ -20,16 +20,17 @@ describe('ProfilerStore', () => {
20
utils = require('./utils');
21
utils.beforeEachProfiling();
22
23
- legacyRender = utils.legacyRender;
24
-
23
store = global.store;
24
store.collapseNodesByDefault = false;
25
store.recordChangeDescriptions = true;
26
27
React = require('react');
30
- ReactDOM = require('react-dom');
28
});
29
30
+ const {render, unmount} = getVersionedRenderImplementation();
31
+ const {render: renderOther, unmount: unmountOther} =
32
+ getVersionedRenderImplementation();
33
+
34
// @reactVersion >= 16.9
35
it('should not remove profiling data when roots are unmounted', async () => {
36
const Parent = ({count}) =>
@@ -38,19 +39,16 @@ describe('ProfilerStore', () => {
39
.map((_, index) => <Child key={index} duration={index} />);
40
const Child = () => <div>Hi!</div>;
41
41
- const containerA = document.createElement('div');
42
- const containerB = document.createElement('div');
43
-
42
utils.act(() => {
45
- legacyRender(<Parent key="A" count={3} />, containerA);
46
- legacyRender(<Parent key="B" count={2} />, containerB);
43
+ render(<Parent key="A" count={3} />);
44
+ renderOther(<Parent key="B" count={2} />);
45
});
46
47
utils.act(() => store.profilerStore.startProfiling());
48
49
utils.act(() => {
52
- legacyRender(<Parent key="A" count={4} />, containerA);
53
- legacyRender(<Parent key="B" count={1} />, containerB);
50
+ render(<Parent key="A" count={4} />);
51
+ renderOther(<Parent key="B" count={1} />);
52
});
53
54
utils.act(() => store.profilerStore.stopProfiling());
@@ -58,12 +56,10 @@ describe('ProfilerStore', () => {
56
const rootA = store.roots[0];
57
const rootB = store.roots[1];
58
61
- utils.act(() => ReactDOM.unmountComponentAtNode(containerB));
62
-
59
+ utils.act(() => unmountOther());
60
expect(store.profilerStore.getDataForRoot(rootA)).not.toBeNull();
61
65
- utils.act(() => ReactDOM.unmountComponentAtNode(containerA));
66
-
62
+ utils.act(() => unmount());
63
expect(store.profilerStore.getDataForRoot(rootB)).not.toBeNull();
64
});
65
@@ -95,14 +91,9 @@ describe('ProfilerStore', () => {
91
return <input ref={inputRef} value={name} onChange={handleChange} />;
92
};
93
98
- const container = document.createElement('div');
99
-
100
- // This element has to be in the <body> for the event system to work.
101
- document.body.appendChild(container);
102
-
94
// It's important that this test uses legacy sync mode.
95
// The root API does not trigger this particular failing case.
105
- legacyRender(<ControlledInput />, container);
96
+ utils.act(() => render(<ControlledInput />));
97
98
utils.act(() => store.profilerStore.startProfiling());
99
@@ -148,14 +139,9 @@ describe('ProfilerStore', () => {
139
return <input ref={inputRef} onBlur={handleBlur} />;
140
};
141
151
- const container = document.createElement('div');
152
-
153
- // This element has to be in the <body> for the event system to work.
154
- document.body.appendChild(container);
155
-
142
// It's important that this test uses legacy sync mode.
143
// The root API does not trigger this particular failing case.
158
- legacyRender(<Example />, container);
144
+ utils.act(() => render(<Example />));
145
146
expect(commitCount).toBe(1);
147
commitCount = 0;
@@ -164,10 +150,10 @@ describe('ProfilerStore', () => {
150
151
// Focus and blur.
152
const target = inputRef.current;
167
- target.focus();
168
- target.blur();
169
- target.focus();
170
- target.blur();
153
+ utils.act(() => target.focus());
154
+ utils.act(() => target.blur());
155
+ utils.act(() => target.focus());
156
+ utils.act(() => target.blur());
157
expect(commitCount).toBe(1);
158
159
utils.act(() => store.profilerStore.stopProfiling());
@@ -204,14 +190,9 @@ describe('ProfilerStore', () => {
190
return state.hasOwnProperty;
191
};
192
207
- const container = document.createElement('div');
208
-
209
- // This element has to be in the <body> for the event system to work.
210
- document.body.appendChild(container);
211
-
193
// It's important that this test uses legacy sync mode.
194
// The root API does not trigger this particular failing case.
214
- legacyRender(<ControlledInput />, container);
195
+ utils.act(() => render(<ControlledInput />));
196
197
utils.act(() => store.profilerStore.startProfiling());
198
utils.act(() =>
@@ -243,9 +224,7 @@ describe('ProfilerStore', () => {
224
);
225
};
226
246
- const container = document.createElement('div');
247
-
248
- utils.act(() => legacyRender(<App />, container));
227
+ utils.act(() => render(<App />));
228
utils.act(() => store.profilerStore.startProfiling());
229
});
230
});