Tweaks
Brian Vaughn committed
May 28, 2019 at 13:57 UTC
5429f651b478a0e9860af83ab962984af21b4b19
3 files changed
+86
-66
src/__tests__/inspectedElementContext-test.js
+68
-62
@@ -8,7 +8,6 @@ import type Store from 'src/devtools/store';
8
describe('InspectedElementContext', () => {
9
let React;
10
let ReactDOM;
11
- let act;
11
let TestRenderer: ReactTestRenderer;
12
let bridge: Bridge;
13
let store: Store;
@@ -20,18 +19,6 @@ describe('InspectedElementContext', () => {
19
let StoreContext;
20
let TreeContextController;
21
23
- // a version of actAsync that *doesn't* recursively flush timers
24
- async function actAsync(cb: () => *): Promise<void> {
25
- // $FlowFixMe Flow doesn't know about "await act()" yet
26
- await act(async () => {
27
- await cb();
28
- });
29
- // $FlowFixMe Flow doesn't know about "await act()" yet
30
- await act(async () => {
31
- jest.runOnlyPendingTimers();
32
- });
33
- }
34
-
22
beforeEach(() => {
23
utils = require('./utils');
24
utils.beforeEachProfiling();
@@ -42,7 +29,6 @@ describe('InspectedElementContext', () => {
29
30
React = require('react');
31
ReactDOM = require('react-dom');
45
- act = require('react-dom/test-utils').act;
32
TestRenderer = utils.requireTestRenderer();
33
34
BridgeContext = require('src/devtools/views/context').BridgeContext;
@@ -81,7 +67,9 @@ describe('InspectedElementContext', () => {
67
};
68
69
const container = document.createElement('div');
84
- utils.act(() => ReactDOM.render(<Example foo={1} bar="abc" />, container));
70
+ await utils.actAsync(() =>
71
+ ReactDOM.render(<Example foo={1} bar="abc" />, container)
72
+ );
73
expect(store).toMatchSnapshot('1: mount');
74
75
const example = ((store.getElementAtIndex(0): any): Element);
@@ -98,17 +86,19 @@ describe('InspectedElementContext', () => {
86
return null;
87
}
88
101
- await actAsync(() =>
102
- TestRenderer.create(
103
- <Contexts
104
- defaultSelectedElementID={example.id}
105
- defaultSelectedElementIndex={0}
106
- >
107
- <React.Suspense fallback={null}>
108
- <Suspender target={example} />
109
- </React.Suspense>
110
- </Contexts>
111
- )
89
+ await utils.actAsync(
90
+ () =>
91
+ TestRenderer.create(
92
+ <Contexts
93
+ defaultSelectedElementID={example.id}
94
+ defaultSelectedElementIndex={0}
95
+ >
96
+ <React.Suspense fallback={null}>
97
+ <Suspender target={example} />
98
+ </React.Suspense>
99
+ </Contexts>
100
+ ),
101
+ false
102
);
103
expect(didFinish).toBe(true);
104
@@ -119,7 +109,10 @@ describe('InspectedElementContext', () => {
109
const Example = () => null;
110
111
const container = document.createElement('div');
122
- utils.act(() => ReactDOM.render(<Example foo={1} bar="abc" />, container));
112
+ await utils.actAsync(
113
+ () => ReactDOM.render(<Example foo={1} bar="abc" />, container),
114
+ false
115
+ );
116
expect(store).toMatchSnapshot('1: mount');
117
118
const example = ((store.getElementAtIndex(0): any): Element);
@@ -132,8 +125,10 @@ describe('InspectedElementContext', () => {
125
return null;
126
}
127
135
- await actAsync(() =>
136
- TestRenderer.create(
128
+ let renderer;
129
+
130
+ await utils.actAsync(() => {
131
+ renderer = TestRenderer.create(
132
<Contexts
133
defaultSelectedElementID={example.id}
134
defaultSelectedElementIndex={0}
@@ -142,26 +137,29 @@ describe('InspectedElementContext', () => {
137
<Suspender target={example} />
138
</React.Suspense>
139
</Contexts>
145
- )
146
- );
140
+ );
141
+ }, false);
142
expect(inspectedElement).toMatchSnapshot('2: initial render');
143
149
- await actAsync(() =>
150
- ReactDOM.render(<Example foo={2} bar="def" />, container)
144
+ await utils.actAsync(
145
+ () => ReactDOM.render(<Example foo={2} bar="def" />, container),
146
+ false
147
);
148
149
inspectedElement = null;
154
- await actAsync(() =>
155
- TestRenderer.create(
156
- <Contexts
157
- defaultSelectedElementID={example.id}
158
- defaultSelectedElementIndex={0}
159
- >
160
- <React.Suspense fallback={null}>
161
- <Suspender target={example} />
162
- </React.Suspense>
163
- </Contexts>
164
- )
150
+ await utils.actAsync(
151
+ () =>
152
+ renderer.update(
153
+ <Contexts
154
+ defaultSelectedElementID={example.id}
155
+ defaultSelectedElementIndex={0}
156
+ >
157
+ <React.Suspense fallback={null}>
158
+ <Suspender target={example} />
159
+ </React.Suspense>
160
+ </Contexts>
161
+ ),
162
+ false
163
);
164
expect(inspectedElement).toMatchSnapshot('2: updated state');
165
@@ -179,7 +177,7 @@ describe('InspectedElementContext', () => {
177
});
178
179
const container = document.createElement('div');
182
- utils.act(() =>
180
+ await utils.actAsync(() =>
181
ReactDOM.render(
182
<Wrapper>
183
<Target foo={1} bar="abc" />
@@ -202,7 +200,7 @@ describe('InspectedElementContext', () => {
200
targetRenderCount = 0;
201
202
let renderer;
205
- await actAsync(
203
+ await utils.actAsync(
204
() =>
205
(renderer = TestRenderer.create(
206
<Contexts
@@ -213,7 +211,8 @@ describe('InspectedElementContext', () => {
211
<Suspender target={id} />
212
</React.Suspense>
213
</Contexts>
216
- ))
214
+ )),
215
+ false
216
);
217
expect(targetRenderCount).toBe(1);
218
expect(inspectedElement).toMatchSnapshot('2: initial render');
@@ -222,27 +221,34 @@ describe('InspectedElementContext', () => {
221
222
targetRenderCount = 0;
223
inspectedElement = null;
225
- await actAsync(() =>
226
- renderer.update(
227
- <Contexts defaultSelectedElementID={id} defaultSelectedElementIndex={1}>
228
- <React.Suspense fallback={null}>
229
- <Suspender target={id} />
230
- </React.Suspense>
231
- </Contexts>
232
- )
224
+ await utils.actAsync(
225
+ () =>
226
+ renderer.update(
227
+ <Contexts
228
+ defaultSelectedElementID={id}
229
+ defaultSelectedElementIndex={1}
230
+ >
231
+ <React.Suspense fallback={null}>
232
+ <Suspender target={id} />
233
+ </React.Suspense>
234
+ </Contexts>
235
+ ),
236
+ false
237
);
238
expect(targetRenderCount).toBe(0);
239
expect(inspectedElement).toEqual(initialInspectedElement);
240
241
targetRenderCount = 0;
242
239
- await actAsync(() =>
240
- ReactDOM.render(
241
- <Wrapper>
242
- <Target foo={2} bar="def" />
243
- </Wrapper>,
244
- container
245
- )
243
+ await utils.actAsync(
244
+ () =>
245
+ ReactDOM.render(
246
+ <Wrapper>
247
+ <Target foo={2} bar="def" />
248
+ </Wrapper>,
249
+ container
250
+ ),
251
+ false
252
);
253
254
// Target should have been rendered once (by ReactDOM) and once by DevTools for inspection.
src/__tests__/profilingCharts-test.js
+3
@@ -88,6 +88,7 @@ describe('profiling charts', () => {
88
89
for (let commitIndex = 0; commitIndex < 2; commitIndex++) {
90
renderFinished = false;
91
+
92
utils.act(() => {
93
TestRenderer.create(
94
<Validator commitIndex={commitIndex} rootID={rootID} />
@@ -161,6 +162,7 @@ describe('profiling charts', () => {
162
163
for (let commitIndex = 0; commitIndex < 2; commitIndex++) {
164
renderFinished = false;
165
+
166
utils.act(() => {
167
TestRenderer.create(
168
<Validator commitIndex={commitIndex} rootID={rootID} />
@@ -225,6 +227,7 @@ describe('profiling charts', () => {
227
228
for (let commitIndex = 0; commitIndex < 2; commitIndex++) {
229
renderFinished = false;
230
+
231
utils.act(() => {
232
TestRenderer.create(
233
<Validator commitIndex={commitIndex} rootID={rootID} />
src/__tests__/utils.js
+15
-4
@@ -19,17 +19,28 @@ export function act(callback: Function): void {
19
});
20
}
21
22
-export async function actAsync(cb: () => *): Promise<void> {
22
+export async function actAsync(
23
+ cb: () => *,
24
+ recursivelyFlush: boolean = true
25
+): Promise<void> {
26
const TestUtils = require('react-dom/test-utils');
27
28
// $FlowFixMe Flow doens't know about "await act()" yet
29
await TestUtils.act(async () => {
30
await cb();
31
});
29
- while (jest.getTimerCount() > 0) {
30
- // $FlowFixMe Flow doens't know about "await act()" yet
32
+
33
+ if (recursivelyFlush) {
34
+ while (jest.getTimerCount() > 0) {
35
+ // $FlowFixMe Flow doens't know about "await act()" yet
36
+ await TestUtils.act(async () => {
37
+ jest.runAllTimers();
38
+ });
39
+ }
40
+ } else {
41
+ // $FlowFixMe Flow doesn't know about "await act()" yet
42
await TestUtils.act(async () => {
32
- jest.runAllTimers();
43
+ jest.runOnlyPendingTimers();
44
});
45
}
46
}