Skip to content

Commit 618041b

Browse files
mdjastrzebskimdjastrzebski
committed
global var
1 parent 7b31483 commit 618041b

4 files changed

Lines changed: 260 additions & 243 deletions

File tree

‎src/__tests__/performance.test.tsx‎

Lines changed: 59 additions & 150 deletions
Original file line numberDiff line numberDiff line change
@@ -15,64 +15,27 @@ afterEach(() => {
1515
setPerformanceMetricsEnabled(false);
1616
});
1717

18-
function getTestRendererMarks(): PerformanceMark[] {
19-
return performance
20-
.getEntriesByType("mark")
21-
.filter((m) => true || m.name.startsWith("test-renderer/")) as PerformanceMark[];
18+
function getPerfMarks(): PerformanceMark[] {
19+
return performance.getEntriesByType("mark") as PerformanceMark[];
2220
}
2321

24-
function getTestRendererMeasures(): PerformanceMeasure[] {
25-
return performance
26-
.getEntriesByType("measure")
27-
.filter((m) => true || m.name.startsWith("test-renderer/")) as PerformanceMeasure[];
22+
function getPerfMeasures(): PerformanceMeasure[] {
23+
return performance.getEntriesByType("measure") as PerformanceMeasure[];
2824
}
2925

3026
describe("performance metrics", () => {
3127
test("does not log marks when disabled", async () => {
3228
const root = createRoot();
3329
await renderWithAct(root, <div />);
34-
35-
expect(getTestRendererMarks()).toMatchInlineSnapshot(`
36-
[
37-
{
38-
"detail": null,
39-
"duration": 0,
40-
"entryType": "mark",
41-
"name": "ACT:start",
42-
"startTime": 3922.953585,
43-
},
44-
{
45-
"detail": null,
46-
"duration": 0,
47-
"entryType": "mark",
48-
"name": "ACT:sync start",
49-
"startTime": 3922.974903,
50-
},
51-
{
52-
"detail": null,
53-
"duration": 0,
54-
"entryType": "mark",
55-
"name": "ACT:sync end",
56-
"startTime": 3923.014747,
57-
},
58-
{
59-
"detail": null,
60-
"duration": 0,
61-
"entryType": "mark",
62-
"name": "ACT:async end",
63-
"startTime": 3923.41037,
64-
},
65-
]
66-
`);
67-
expect(getTestRendererMeasures()).toMatchInlineSnapshot(`[]`);
30+
expect(getPerfMeasures().filter((m) => m.name.startsWith("test-renderer/"))).toEqual([]);
6831
});
6932

7033
test("logs marks and measures for render", async () => {
7134
setPerformanceMetricsEnabled(true);
7235
const root = createRoot();
7336
await renderWithAct(root, <div>Hello!</div>);
7437

75-
const marks = getTestRendererMarks();
38+
const marks = getPerfMarks();
7639
expect(marks.some((m) => m.name === "test-renderer/createRoot:start")).toBe(true);
7740
expect(marks.some((m) => m.name === "test-renderer/createRoot:end")).toBe(true);
7841
expect(marks.some((m) => m.name === "test-renderer/render:start")).toBe(true);
@@ -81,47 +44,8 @@ describe("performance metrics", () => {
8144
expect(marks.some((m) => m.name === "test-renderer/react/commit:end")).toBe(true);
8245
expect(marks.some((m) => m.name === "test-renderer/reconciler/createInstance")).toBe(true);
8346
expect(marks.some((m) => m.name === "test-renderer/reconciler/createTextInstance")).toBe(true);
84-
expect(marks.some((m) => m.name === "test-renderer/reconciler/prepareForCommit")).toBe(true);
85-
expect(marks.some((m) => m.name === "test-renderer/reconciler/resetAfterCommit")).toBe(true);
86-
87-
expect(formatPerfEntries(marks)).toMatchInlineSnapshot(`
88-
"0.00ms: test-renderer/createRoot:start
89-
0.07ms: test-renderer/createRoot:end
90-
0.33ms: ACT:start
91-
0.34ms: ACT:sync start
92-
0.34ms: test-renderer/render:start
93-
0.36ms: test-renderer/reconciler/resolveUpdatePriority (priority=32)
94-
0.44ms: test-renderer/reconciler/scheduleMicrotask (id=2)
95-
0.46ms: test-renderer/render:end
96-
0.48ms: ACT:sync end
97-
0.50ms: test-renderer/reconciler/scheduled microtask:start (id=2)
98-
0.52ms: test-renderer/reconciler/scheduled microtask:end (id=2)
99-
0.55ms: test-renderer/reconciler/getRootHostContext
100-
0.57ms: test-renderer/reconciler/getChildHostContext (type="div")
101-
0.59ms: test-renderer/reconciler/shouldSetTextContent (type="div")
102-
0.61ms: test-renderer/reconciler/createTextInstance (text="Hello!")
103-
0.63ms: test-renderer/reconciler/createInstance (type="div")
104-
0.64ms: test-renderer/reconciler/appendInitialChild (parentType="div", childType="text: \\"Hello!\\"")
105-
0.67ms: test-renderer/reconciler/finalizeInitialChildren (type="div")
106-
0.67ms: test-renderer/reconciler/maySuspendCommit (type="div")
107-
0.69ms: test-renderer/reconciler/setCurrentUpdatePriority (priority=2)
108-
0.70ms: test-renderer/reconciler/setCurrentUpdatePriority (priority=2)
109-
0.71ms: test-renderer/reconciler/prepareForCommit
110-
0.71ms: test-renderer/react/commit:start
111-
0.71ms: test-renderer/reconciler/clearContainer
112-
0.72ms: test-renderer/reconciler/appendChildToContainer (childType="div")
113-
0.73ms: test-renderer/react/commit:end
114-
0.74ms: test-renderer/reconciler/resetAfterCommit
115-
0.74ms: test-renderer/reconciler/setCurrentUpdatePriority (priority=2)
116-
0.76ms: test-renderer/reconciler/scheduleMicrotask (id=3)
117-
0.76ms: test-renderer/reconciler/setCurrentUpdatePriority (priority=0)
118-
0.78ms: test-renderer/reconciler/scheduled microtask:start (id=3)
119-
0.79ms: test-renderer/reconciler/scheduled microtask:end (id=3)
120-
0.85ms: ACT:async end
121-
"
122-
`);
12347

124-
const measures = getTestRendererMeasures();
48+
const measures = getPerfMeasures();
12549
expect(measures.some((m) => m.name === "test-renderer/createRoot")).toBe(true);
12650
expect(measures.some((m) => m.name === "test-renderer/render")).toBe(true);
12751
expect(measures.some((m) => m.name === "test-renderer/react/commit")).toBe(true);
@@ -130,38 +54,13 @@ describe("performance metrics", () => {
13054
performance.clearMeasures();
13155

13256
await renderWithAct(root, <div>Hello World!</div>);
133-
const marks2 = getTestRendererMarks();
134-
expect(formatPerfEntries(marks2)).toMatchInlineSnapshot(`
135-
"0.00ms: ACT:start
136-
0.01ms: ACT:sync start
137-
0.02ms: test-renderer/render:start
138-
0.03ms: test-renderer/reconciler/resolveUpdatePriority (priority=32)
139-
0.05ms: test-renderer/reconciler/scheduleMicrotask (id=4)
140-
0.06ms: test-renderer/render:end
141-
0.08ms: ACT:sync end
142-
0.09ms: test-renderer/reconciler/scheduled microtask:start (id=4)
143-
0.10ms: test-renderer/reconciler/scheduled microtask:end (id=4)
144-
0.13ms: test-renderer/reconciler/getRootHostContext
145-
0.17ms: test-renderer/reconciler/getChildHostContext (type="div")
146-
0.19ms: test-renderer/reconciler/shouldSetTextContent (type="div")
147-
0.19ms: test-renderer/reconciler/shouldSetTextContent (type="div")
148-
0.27ms: test-renderer/reconciler/maySuspendCommit (type="div")
149-
0.28ms: test-renderer/reconciler/setCurrentUpdatePriority (priority=2)
150-
0.29ms: test-renderer/reconciler/setCurrentUpdatePriority (priority=2)
151-
0.30ms: test-renderer/reconciler/prepareForCommit
152-
0.30ms: test-renderer/react/commit:start
153-
0.34ms: test-renderer/reconciler/commitTextUpdate (oldText="Hello!", newText="Hello World!")
154-
0.40ms: test-renderer/reconciler/commitUpdate (type="div")
155-
0.41ms: test-renderer/react/commit:end
156-
0.43ms: test-renderer/reconciler/resetAfterCommit
157-
0.43ms: test-renderer/reconciler/setCurrentUpdatePriority (priority=2)
158-
0.44ms: test-renderer/reconciler/scheduleMicrotask (id=5)
159-
0.45ms: test-renderer/reconciler/setCurrentUpdatePriority (priority=0)
160-
0.47ms: test-renderer/reconciler/scheduled microtask:start (id=5)
161-
0.47ms: test-renderer/reconciler/scheduled microtask:end (id=5)
162-
0.58ms: ACT:async end
163-
"
164-
`);
57+
const marks2 = getPerfMarks();
58+
expect(marks2.some((m) => m.name === "test-renderer/render:start")).toBe(true);
59+
expect(marks2.some((m) => m.name === "test-renderer/render:end")).toBe(true);
60+
expect(marks2.some((m) => m.name === "test-renderer/react/commit:start")).toBe(true);
61+
expect(marks2.some((m) => m.name === "test-renderer/react/commit:end")).toBe(true);
62+
expect(marks2.some((m) => m.name === "test-renderer/reconciler/commitTextUpdate")).toBe(true);
63+
expect(marks2.some((m) => m.name === "test-renderer/reconciler/commitUpdate")).toBe(true);
16564
});
16665

16766
function TestComponent() {
@@ -184,57 +83,67 @@ describe("performance metrics", () => {
18483
setPerformanceMetricsEnabled(true);
18584

18685
await act(() => {
187-
// @ts-expect-error - Unsafe call of a(n) `error` type typed value.
188-
// @eslint-disable-next-line @typescript-eslint/no-unsafe-call
189-
root.container.children[0]?.props.onClick();
86+
const child = root.container.children[0];
87+
if (typeof child !== "string") {
88+
const onClick = child.props.onClick as () => void;
89+
onClick();
90+
}
19091
});
19192

192-
const marks = getTestRendererMarks();
193-
expect(formatPerfEntries(marks)).toMatchInlineSnapshot(`
194-
"0.00ms: ACT:start
195-
0.01ms: ACT:sync start
196-
0.03ms: ACT:sync end
197-
0.39ms: ACT:async end
198-
0.53ms: test-renderer/reconciler/resolveUpdatePriority (priority=32)
199-
0.65ms: test-renderer/reconciler/scheduleMicrotask (id=8)
200-
0.71ms: test-renderer/reconciler/scheduled microtask:start (id=8)
201-
0.72ms: test-renderer/reconciler/scheduled microtask:end (id=8)
202-
0.85ms: test-renderer/reconciler/getRootHostContext
203-
1.10ms: test-renderer/reconciler/getChildHostContext (type="div")
204-
1.12ms: test-renderer/reconciler/shouldSetTextContent (type="div")
205-
1.12ms: test-renderer/reconciler/shouldSetTextContent (type="div")
206-
1.30ms: test-renderer/reconciler/maySuspendCommit (type="div")
207-
1.32ms: test-renderer/reconciler/setCurrentUpdatePriority (priority=2)
208-
1.33ms: test-renderer/reconciler/setCurrentUpdatePriority (priority=2)
209-
1.34ms: test-renderer/reconciler/prepareForCommit
210-
1.34ms: test-renderer/react/commit:start
211-
1.35ms: test-renderer/reconciler/commitTextUpdate (oldText="0", newText="1")
212-
1.36ms: test-renderer/reconciler/commitUpdate (type="div")
213-
1.37ms: test-renderer/react/commit:end
214-
1.38ms: test-renderer/reconciler/resetAfterCommit
215-
1.40ms: test-renderer/reconciler/setCurrentUpdatePriority (priority=2)
216-
1.41ms: test-renderer/reconciler/scheduleMicrotask (id=9)
217-
1.42ms: test-renderer/reconciler/setCurrentUpdatePriority (priority=0)
218-
1.44ms: test-renderer/reconciler/scheduled microtask:start (id=9)
219-
1.45ms: test-renderer/reconciler/scheduled microtask:end (id=9)
220-
"
221-
`);
93+
const marks = getPerfMarks();
94+
expect(marks.some((m) => m.name === "test-renderer/render:start")).toBe(false);
95+
expect(marks.some((m) => m.name === "test-renderer/render:end")).toBe(false);
96+
expect(marks.some((m) => m.name === "test-renderer/react/commit:start")).toBe(true);
97+
expect(marks.some((m) => m.name === "test-renderer/react/commit:end")).toBe(true);
98+
expect(marks.some((m) => m.name === "test-renderer/reconciler/commitTextUpdate")).toBe(true);
99+
expect(marks.some((m) => m.name === "test-renderer/reconciler/commitUpdate")).toBe(true);
222100
});
223101

224102
test("logs marks and measures for unmount", async () => {
225103
const root = createRoot();
226104
await renderWithAct(root, <div />);
227105

228106
setPerformanceMetricsEnabled(true);
107+
performance.clearMarks();
108+
performance.clearMeasures();
229109
await unmountWithAct(root);
230110

231-
const marks = getTestRendererMarks();
111+
const marks = getPerfMarks();
232112
expect(marks.some((m) => m.name === "test-renderer/unmount:start")).toBe(true);
233113
expect(marks.some((m) => m.name === "test-renderer/unmount:end")).toBe(true);
234114
expect(marks.some((m) => m.name === "test-renderer/react/commit:start")).toBe(true);
235115
expect(marks.some((m) => m.name === "test-renderer/react/commit:end")).toBe(true);
116+
expect(formatPerfEntries(marks)).toMatchInlineSnapshot(`
117+
"0.00ms: ACT:start
118+
0.01ms: ACT:sync start
119+
0.06ms: test-renderer/unmount:start
120+
0.08ms: test-renderer/reconciler/resolveUpdatePriority (priority=32)
121+
0.11ms: test-renderer/reconciler/scheduleMicrotask (id=12)
122+
0.12ms: test-renderer/unmount:end
123+
0.15ms: test-renderer/reconciler/scheduled microtask:start (id=12)
124+
0.16ms: test-renderer/reconciler/scheduled microtask:end (id=12)
125+
0.17ms: ACT:sync end
126+
0.19ms: test-renderer/reconciler/getRootHostContext
127+
0.24ms: test-renderer/reconciler/setCurrentUpdatePriority (priority=2)
128+
0.29ms: test-renderer/reconciler/setCurrentUpdatePriority (priority=2)
129+
0.30ms: test-renderer/reconciler/prepareForCommit
130+
0.30ms: test-renderer/react/commit:start
131+
0.51ms: test-renderer/reconciler/removeChildFromContainer (childType="div")
132+
0.54ms: test-renderer/react/commit:end
133+
0.56ms: test-renderer/reconciler/resetAfterCommit
134+
0.56ms: test-renderer/reconciler/setCurrentUpdatePriority (priority=2)
135+
0.57ms: test-renderer/reconciler/scheduleMicrotask (id=13)
136+
0.58ms: test-renderer/reconciler/setCurrentUpdatePriority (priority=0)
137+
0.60ms: test-renderer/reconciler/setCurrentUpdatePriority (priority=32)
138+
0.76ms: test-renderer/reconciler/detachDeletedInstance
139+
0.88ms: test-renderer/reconciler/setCurrentUpdatePriority (priority=0)
140+
0.91ms: test-renderer/reconciler/scheduled microtask:start (id=13)
141+
0.91ms: test-renderer/reconciler/scheduled microtask:end (id=13)
142+
0.95ms: ACT:async end
143+
"
144+
`);
236145

237-
const measures = getTestRendererMeasures();
146+
const measures = getPerfMeasures();
238147
expect(measures.some((m) => m.name === "test-renderer/unmount")).toBe(true);
239148
expect(measures.some((m) => m.name === "test-renderer/react/commit")).toBe(true);
240149
});

‎src/performance.ts‎

Lines changed: 9 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,27 +1,31 @@
1-
let _enableMetrics = false;
1+
declare global {
2+
var TEST_RENDERER_ENABLE_PROFILING: boolean | undefined;
3+
}
4+
5+
globalThis.TEST_RENDERER_ENABLE_PROFILING ??= false;
26

37
export function setPerformanceMetricsEnabled(enabled: boolean): void {
4-
_enableMetrics = enabled;
8+
globalThis.TEST_RENDERER_ENABLE_PROFILING = enabled;
59
}
610

711
export function mark(name: string, details?: Record<string, unknown>): void {
8-
if (!_enableMetrics) {
12+
if (!globalThis.TEST_RENDERER_ENABLE_PROFILING) {
913
return;
1014
}
1115

1216
performance.mark(`test-renderer/${name}`, { detail: details });
1317
}
1418

1519
export function measureStart(name: string): void {
16-
if (!_enableMetrics) {
20+
if (!globalThis.TEST_RENDERER_ENABLE_PROFILING) {
1721
return;
1822
}
1923

2024
performance.mark(`test-renderer/${name}:start`);
2125
}
2226

2327
export function measureEnd(name: string, details?: Record<string, unknown>): void {
24-
if (!_enableMetrics) {
28+
if (!globalThis.TEST_RENDERER_ENABLE_PROFILING) {
2529
return;
2630
}
2731

0 commit comments

Comments
 (0)