How to use stopFailedWorkTimer method in Playwright Internal

Best JavaScript code snippet using playwright-internal

Run Playwright Internal automation tests on LambdaTest cloud grid

Perform automation testing on 3000+ real desktop and mobile devices online.

completeUnitOfWork.js

Source: completeUnitOfWork.js Github

copy
1function completeUnitOfWork(unitOfWork: Fiber): Fiber | null {
2  workInProgress = unitOfWork;
3  do {
4      const current = workInProgress.alternate;
5      const returnFiber = workInProgress.return;
6
7      if ((workInProgress.effectTag & Incomplete) === NoEffect) {
8          setCurrentDebugFiberInDEV(workInProgress);
9          let next;
10          if (!enableProfilerTimer ||
11              (workInProgress.mode & ProfileMode) === NoMode
12          ) {
13              next = completeWork(current, workInProgress, renderExpirationTime);
14          } else {
15              startProfilerTimer(workInProgress);
16              next = completeWork(current, workInProgress, renderExpirationTime);
17              // Update render duration assuming we didn't error.
18              stopProfilerTimerIfRunningAndRecordDelta(workInProgress, false);
19          }
20          stopWorkTimer(workInProgress);
21          resetCurrentDebugFiberInDEV();
22          resetChildExpirationTime(workInProgress);
23
24          if (next !== null) {
25              // Completing this fiber spawned new work. Work on that next.
26              return next;
27          }
28
29          if (
30              returnFiber !== null &&
31              // Do not append effects to parents if a sibling failed to complete
32              (returnFiber.effectTag & Incomplete) === NoEffect
33          ) {
34              // Append all the effects of the subtree and this fiber onto the effect
35              // list of the parent. The completion order of the children affects the
36              // side-effect order.
37              if (returnFiber.firstEffect === null) {
38                  returnFiber.firstEffect = workInProgress.firstEffect;
39              }
40              if (workInProgress.lastEffect !== null) {
41                  if (returnFiber.lastEffect !== null) {
42                      returnFiber.lastEffect.nextEffect = workInProgress.firstEffect;
43                  }
44                  returnFiber.lastEffect = workInProgress.lastEffect;
45              }
46
47              const effectTag = workInProgress.effectTag;
48
49              if (effectTag > PerformedWork) {
50                  if (returnFiber.lastEffect !== null) {
51                      returnFiber.lastEffect.nextEffect = workInProgress;
52                  } else {
53                      returnFiber.firstEffect = workInProgress;
54                  }
55                  returnFiber.lastEffect = workInProgress;
56              }
57          }
58      } else {
59          // This fiber did not complete because something threw. Pop values off
60          // the stack without entering the complete phase. If this is a boundary,
61          // capture values if possible.
62          const next = unwindWork(workInProgress, renderExpirationTime);
63
64          // Because this fiber did not complete, don't reset its expiration time.
65
66          if (
67              enableProfilerTimer &&
68              (workInProgress.mode & ProfileMode) !== NoMode
69          ) {
70              // Record the render duration for the fiber that errored.
71              stopProfilerTimerIfRunningAndRecordDelta(workInProgress, false);
72
73              // Include the time spent working on failed children before continuing.
74              let actualDuration = workInProgress.actualDuration;
75              let child = workInProgress.child;
76              while (child !== null) {
77                  actualDuration += child.actualDuration;
78                  child = child.sibling;
79              }
80              workInProgress.actualDuration = actualDuration;
81          }
82
83          if (next !== null) {
84              // If completing this work spawned new work, do that next. We'll come
85              // back here again.
86              // Since we're restarting, remove anything that is not a host effect
87              // from the effect tag.
88              // TODO: The name stopFailedWorkTimer is misleading because Suspense
89              // also captures and restarts.
90              stopFailedWorkTimer(workInProgress);
91              next.effectTag &= HostEffectMask;
92              return next;
93          }
94          stopWorkTimer(workInProgress);
95
96          if (returnFiber !== null) {
97              // Mark the parent fiber as incomplete and clear its effect list.
98              returnFiber.firstEffect = returnFiber.lastEffect = null;
99              returnFiber.effectTag |= Incomplete;
100          }
101      }
102
103      const siblingFiber = workInProgress.sibling;
104      if (siblingFiber !== null) {
105          // If there is more work to do in this returnFiber, do that next.
106          return siblingFiber;
107      }
108      // Otherwise, return to the parent
109      workInProgress = returnFiber;
110  } while (workInProgress !== null);
111
112  // We've reached the root.
113  if (workInProgressRootExitStatus === RootIncomplete) {
114      workInProgressRootExitStatus = RootCompleted;
115  }
116  return null;
117}
Full Screen

simple_scheduler.js

Source: simple_scheduler.js Github

copy
1// 遍历得到Fiber树
2
3let example_Fiber_root = require('./ReactFiber');
4
5// 下一个执行单元,初始化为空
6let nextUnitOfWork = null;
7
8/**
9 * 在单链表的当前节点中,获取下一个节点
10 * @desc 每个执行单元由 beginWork() 和 completeUnitOfWork() 构成
11 * @param {Fiber} workInProgress 当前Fiber节点
12 * @return {Fiber} next 返回下一个节点的单链表树结构
13 */
14function performUnitOfWork(workInProgress) {
15  const current = workInProgress.alternate;
16
17  // 当前传入参数(Fiber Node)的 下一个节点
18  let next = beginWork(current, workInProgress, nextRenderExpirationTime);
19
20  if (next === null) { // 如果没有子节点,执行当前任务单元
21    next = completeUnitOfWork(workInProgress);
22  }
23
24  return next;
25}
26
27/**
28 * 循环执行任务
29 * 深度优先遍历 构建FIber树 入口
30 * @param {boolean} isYieldy react是否要让出时间片
31 */
32function workLoop(isYieldy) {
33  while (nextUnitOfWork !== null){
34    nextUnitOfWork = performUnitOfWork(nextUnitOfWork);
35  }
36
37}
38
39/**
40 * 构建effectlist,(返回兄弟节点)
41 * @desc 没有子节点时,遍历兄弟节点作为下一个执行单元。(返回兄弟节点)
42 *        兄弟节点执行结束,向上回溯至根节点。
43 *        向上回溯过程中,收集所有diff(后序遍历收集有副作用的Fiber,组成effectlist),准备进入commit阶段。
44 * @param {Fiber} workInProgress 当前Fiber节点
45 * @return {Fiber|null} next|null  返回当前Fiber节点的兄弟节点
46 *
47 * completeWork()通过tag调用相对应的更新方法, 返回第一个子节点
48 */
49function completeUnitOfWork(workInProgress: Fiber): Fiber | null {
50  while (true) {
51    const current = workInProgress.alternate;
52    // 当前节点的 父节点 和 兄弟节点
53    const returnFiber = workInProgress.return;
54    const siblingFiber = workInProgress.sibling;
55
56    if ((workInProgress.effectTag & Incomplete) === NoEffect) {
57      nextUnitOfWork = workInProgress;
58      if (enableProfilerTimer) {
59        if (workInProgress.mode & ProfileMode) {
60          startProfilerTimer(workInProgress);
61        }
62        nextUnitOfWork = completeWork(
63          current,
64          workInProgress,
65          nextRenderExpirationTime,
66        );
67        if (workInProgress.mode & ProfileMode) {
68          // Update render duration assuming we didn't error.
69          stopProfilerTimerIfRunningAndRecordDelta(workInProgress, false);
70        }
71      } else {
72        nextUnitOfWork = completeWork(
73          current,
74          workInProgress,
75          nextRenderExpirationTime,
76        );
77      }
78      stopWorkTimer(workInProgress);
79      resetChildExpirationTime(workInProgress, nextRenderExpirationTime);
80
81      if (nextUnitOfWork !== null) {
82        // Completing this fiber spawned new work. Work on that next.
83        return nextUnitOfWork;
84      }
85
86      // 下面的两个if是构成effectlist的关键:从下往上挂载。
87      // (1)把当前Fiber节点的子节点effect挂在到当前Fiber的父节点。当前Fiber相当于一个中间变量,沟通其父亲和其儿子。
88      if (
89        returnFiber !== null &&
90        // Do not append effects to parents if a sibling failed to complete
91        (returnFiber.effectTag & Incomplete) === NoEffect
92      ) {
93        // Append all the effects of the subtree and this fiber onto the effect
94        // list of the parent. The completion order of the children affects the
95        // side-effect order.
96        if (returnFiber.firstEffect === null) {
97          returnFiber.firstEffect = workInProgress.firstEffect;
98        }
99        if (workInProgress.lastEffect !== null) {
100          if (returnFiber.lastEffect !== null) {
101            returnFiber.lastEffect.nextEffect = workInProgress.firstEffect;
102          }
103          returnFiber.lastEffect = workInProgress.lastEffect;
104        }
105        // 当前Fiber节点的副作用标识位
106        const effectTag = workInProgress.effectTag;
107        // (2)把当前Fiber节点的effect挂在到其父节点上
108        if (effectTag > PerformedWork) { // 有副作用,收集effect
109          if (returnFiber.lastEffect !== null) { // 如果父节点的最后副作用指针有值
110            // 则effectlist中间部分使用nextEffect指针进行连接
111            returnFiber.lastEffect.nextEffect = workInProgress;
112          } else {
113            // 这里
114            returnFiber.firstEffect = workInProgress;
115          }
116          // 这里
117          returnFiber.lastEffect = workInProgress;
118        }
119      }
120
121
122      if (siblingFiber !== null) {
123        // If there is more work to do in this returnFiber, do that next.
124        return siblingFiber;
125      } else if (returnFiber !== null) {
126        // If there's no more work in this returnFiber. Complete the returnFiber.
127        workInProgress = returnFiber;
128        continue;
129      } else {
130        // We've reached the root.
131        return null;
132      }
133    } else { // 无副作用
134      if (enableProfilerTimer && workInProgress.mode & ProfileMode) {
135        // Record the render duration for the fiber that errored.
136        stopProfilerTimerIfRunningAndRecordDelta(workInProgress, false);
137
138        // Include the time spent working on failed children before continuing.
139        let actualDuration = workInProgress.actualDuration;
140        let child = workInProgress.child;
141        while (child !== null) {
142          actualDuration += child.actualDuration;
143          child = child.sibling;
144        }
145        workInProgress.actualDuration = actualDuration;
146      }
147
148      // This fiber did not complete because something threw. Pop values off
149      // the stack without entering the complete phase. If this is a boundary,
150      // capture values if possible.
151      const next = unwindWork(workInProgress, nextRenderExpirationTime);
152      // Because this fiber did not complete, don't reset its expiration time.
153      if (workInProgress.effectTag & DidCapture) {
154        // Restarting an error boundary
155        stopFailedWorkTimer(workInProgress);
156      } else {
157        stopWorkTimer(workInProgress);
158      }
159
160
161      if (next !== null) {
162        stopWorkTimer(workInProgress);
163
164        // If completing this work spawned new work, do that next. We'll come
165        // back here again.
166        // Since we're restarting, remove anything that is not a host effect
167        // from the effect tag.
168        next.effectTag &= HostEffectMask;
169        return next;
170      }
171
172      if (returnFiber !== null) {
173        // Mark the parent fiber as incomplete and clear its effect list.
174        returnFiber.firstEffect = returnFiber.lastEffect = null;
175        returnFiber.effectTag |= Incomplete;
176      }
177
178      if (siblingFiber !== null) {
179        // If there is more work to do in this returnFiber, do that next.
180        return siblingFiber;
181      } else if (returnFiber !== null) {
182        // If there's no more work in this returnFiber. Complete the returnFiber.
183        workInProgress = returnFiber;
184        continue;
185      } else {
186        return null;
187      }
188    }
189  }
190
191  return null;
192}
193
Full Screen

ReactDebugFiberPerf.js

Source: ReactDebugFiberPerf.js Github

copy
1/**
2 * Copyright (c) 2013-present, Facebook, Inc.
3 *
4 * This source code is licensed under the MIT license found in the
5 * LICENSE file in the root directory of this source tree.
6 *
7 * @flow
8 */
9
10import type {Fiber} from './ReactFiber';
11
12import {enableUserTimingAPI} from 'shared/ReactFeatureFlags';
13import getComponentName from 'shared/getComponentName';
14import {
15  HostRoot,
16  HostComponent,
17  HostText,
18  HostPortal,
19  Fragment,
20  ContextProvider,
21  ContextConsumer,
22  Mode,
23} from 'shared/ReactTypeOfWork';
24
25type MeasurementPhase =
26  | 'componentWillMount'
27  | 'componentWillUnmount'
28  | 'componentWillReceiveProps'
29  | 'shouldComponentUpdate'
30  | 'componentWillUpdate'
31  | 'componentDidUpdate'
32  | 'componentDidMount'
33  | 'getChildContext'
34  | 'getSnapshotBeforeUpdate';
35
36// Prefix measurements so that it's possible to filter them.
37// Longer prefixes are hard to read in DevTools.
38const reactEmoji = '\u269B';
39const warningEmoji = '\u26D4';
40const supportsUserTiming =
41  typeof performance !== 'undefined' &&
42  typeof performance.mark === 'function' &&
43  typeof performance.clearMarks === 'function' &&
44  typeof performance.measure === 'function' &&
45  typeof performance.clearMeasures === 'function';
46
47// Keep track of current fiber so that we know the path to unwind on pause.
48// TODO: this looks the same as nextUnitOfWork in scheduler. Can we unify them?
49let currentFiber: Fiber | null = null;
50// If we're in the middle of user code, which fiber and method is it?
51// Reusing `currentFiber` would be confusing for this because user code fiber
52// can change during commit phase too, but we don't need to unwind it (since
53// lifecycles in the commit phase don't resemble a tree).
54let currentPhase: MeasurementPhase | null = null;
55let currentPhaseFiber: Fiber | null = null;
56// Did lifecycle hook schedule an update? This is often a performance problem,
57// so we will keep track of it, and include it in the report.
58// Track commits caused by cascading updates.
59let isCommitting: boolean = false;
60let hasScheduledUpdateInCurrentCommit: boolean = false;
61let hasScheduledUpdateInCurrentPhase: boolean = false;
62let commitCountInCurrentWorkLoop: number = 0;
63let effectCountInCurrentCommit: number = 0;
64let isWaitingForCallback: boolean = false;
65// During commits, we only show a measurement once per method name
66// to avoid stretch the commit phase with measurement overhead.
67const labelsInCurrentCommit: Set<string> = new Set();
68
69const formatMarkName = (markName: string) => {
70  return `${reactEmoji} ${markName}`;
71};
72
73const formatLabel = (label: string, warning: string | null) => {
74  const prefix = warning ? `${warningEmoji} ` : `${reactEmoji} `;
75  const suffix = warning ? ` Warning: ${warning}` : '';
76  return `${prefix}${label}${suffix}`;
77};
78
79const beginMark = (markName: string) => {
80  performance.mark(formatMarkName(markName));
81};
82
83const clearMark = (markName: string) => {
84  performance.clearMarks(formatMarkName(markName));
85};
86
87const endMark = (label: string, markName: string, warning: string | null) => {
88  const formattedMarkName = formatMarkName(markName);
89  const formattedLabel = formatLabel(label, warning);
90  try {
91    performance.measure(formattedLabel, formattedMarkName);
92  } catch (err) {
93    // If previous mark was missing for some reason, this will throw.
94    // This could only happen if React crashed in an unexpected place earlier.
95    // Don't pile on with more errors.
96  }
97  // Clear marks immediately to avoid growing buffer.
98  performance.clearMarks(formattedMarkName);
99  performance.clearMeasures(formattedLabel);
100};
101
102const getFiberMarkName = (label: string, debugID: number) => {
103  return `${label} (#${debugID})`;
104};
105
106const getFiberLabel = (
107  componentName: string,
108  isMounted: boolean,
109  phase: MeasurementPhase | null,
110) => {
111  if (phase === null) {
112    // These are composite component total time measurements.
113    return `${componentName} [${isMounted ? 'update' : 'mount'}]`;
114  } else {
115    // Composite component methods.
116    return `${componentName}.${phase}`;
117  }
118};
119
120const beginFiberMark = (
121  fiber: Fiber,
122  phase: MeasurementPhase | null,
123): boolean => {
124  const componentName = getComponentName(fiber) || 'Unknown';
125  const debugID = ((fiber._debugID: any): number);
126  const isMounted = fiber.alternate !== null;
127  const label = getFiberLabel(componentName, isMounted, phase);
128
129  if (isCommitting && labelsInCurrentCommit.has(label)) {
130    // During the commit phase, we don't show duplicate labels because
131    // there is a fixed overhead for every measurement, and we don't
132    // want to stretch the commit phase beyond necessary.
133    return false;
134  }
135  labelsInCurrentCommit.add(label);
136
137  const markName = getFiberMarkName(label, debugID);
138  beginMark(markName);
139  return true;
140};
141
142const clearFiberMark = (fiber: Fiber, phase: MeasurementPhase | null) => {
143  const componentName = getComponentName(fiber) || 'Unknown';
144  const debugID = ((fiber._debugID: any): number);
145  const isMounted = fiber.alternate !== null;
146  const label = getFiberLabel(componentName, isMounted, phase);
147  const markName = getFiberMarkName(label, debugID);
148  clearMark(markName);
149};
150
151const endFiberMark = (
152  fiber: Fiber,
153  phase: MeasurementPhase | null,
154  warning: string | null,
155) => {
156  const componentName = getComponentName(fiber) || 'Unknown';
157  const debugID = ((fiber._debugID: any): number);
158  const isMounted = fiber.alternate !== null;
159  const label = getFiberLabel(componentName, isMounted, phase);
160  const markName = getFiberMarkName(label, debugID);
161  endMark(label, markName, warning);
162};
163
164const shouldIgnoreFiber = (fiber: Fiber): boolean => {
165  // Host components should be skipped in the timeline.
166  // We could check typeof fiber.type, but does this work with RN?
167  switch (fiber.tag) {
168    case HostRoot:
169    case HostComponent:
170    case HostText:
171    case HostPortal:
172    case Fragment:
173    case ContextProvider:
174    case ContextConsumer:
175    case Mode:
176      return true;
177    default:
178      return false;
179  }
180};
181
182const clearPendingPhaseMeasurement = () => {
183  if (currentPhase !== null && currentPhaseFiber !== null) {
184    clearFiberMark(currentPhaseFiber, currentPhase);
185  }
186  currentPhaseFiber = null;
187  currentPhase = null;
188  hasScheduledUpdateInCurrentPhase = false;
189};
190
191const pauseTimers = () => {
192  // Stops all currently active measurements so that they can be resumed
193  // if we continue in a later deferred loop from the same unit of work.
194  let fiber = currentFiber;
195  while (fiber) {
196    if (fiber._debugIsCurrentlyTiming) {
197      endFiberMark(fiber, null, null);
198    }
199    fiber = fiber.return;
200  }
201};
202
203const resumeTimersRecursively = (fiber: Fiber) => {
204  if (fiber.return !== null) {
205    resumeTimersRecursively(fiber.return);
206  }
207  if (fiber._debugIsCurrentlyTiming) {
208    beginFiberMark(fiber, null);
209  }
210};
211
212const resumeTimers = () => {
213  // Resumes all measurements that were active during the last deferred loop.
214  if (currentFiber !== null) {
215    resumeTimersRecursively(currentFiber);
216  }
217};
218
219export function recordEffect(): void {
220  if (enableUserTimingAPI) {
221    effectCountInCurrentCommit++;
222  }
223}
224
225export function recordScheduleUpdate(): void {
226  if (enableUserTimingAPI) {
227    if (isCommitting) {
228      hasScheduledUpdateInCurrentCommit = true;
229    }
230    if (
231      currentPhase !== null &&
232      currentPhase !== 'componentWillMount' &&
233      currentPhase !== 'componentWillReceiveProps'
234    ) {
235      hasScheduledUpdateInCurrentPhase = true;
236    }
237  }
238}
239
240export function startRequestCallbackTimer(): void {
241  if (enableUserTimingAPI) {
242    if (supportsUserTiming && !isWaitingForCallback) {
243      isWaitingForCallback = true;
244      beginMark('(Waiting for async callback...)');
245    }
246  }
247}
248
249export function stopRequestCallbackTimer(
250  didExpire: boolean,
251  expirationTime: number,
252): void {
253  if (enableUserTimingAPI) {
254    if (supportsUserTiming) {
255      isWaitingForCallback = false;
256      const warning = didExpire ? 'React was blocked by main thread' : null;
257      endMark(
258        `(Waiting for async callback... will force flush in ${expirationTime} ms)`,
259        '(Waiting for async callback...)',
260        warning,
261      );
262    }
263  }
264}
265
266export function startWorkTimer(fiber: Fiber): void {
267  if (enableUserTimingAPI) {
268    if (!supportsUserTiming || shouldIgnoreFiber(fiber)) {
269      return;
270    }
271    // If we pause, this is the fiber to unwind from.
272    currentFiber = fiber;
273    if (!beginFiberMark(fiber, null)) {
274      return;
275    }
276    fiber._debugIsCurrentlyTiming = true;
277  }
278}
279
280export function cancelWorkTimer(fiber: Fiber): void {
281  if (enableUserTimingAPI) {
282    if (!supportsUserTiming || shouldIgnoreFiber(fiber)) {
283      return;
284    }
285    // Remember we shouldn't complete measurement for this fiber.
286    // Otherwise flamechart will be deep even for small updates.
287    fiber._debugIsCurrentlyTiming = false;
288    clearFiberMark(fiber, null);
289  }
290}
291
292export function stopWorkTimer(fiber: Fiber): void {
293  if (enableUserTimingAPI) {
294    if (!supportsUserTiming || shouldIgnoreFiber(fiber)) {
295      return;
296    }
297    // If we pause, its parent is the fiber to unwind from.
298    currentFiber = fiber.return;
299    if (!fiber._debugIsCurrentlyTiming) {
300      return;
301    }
302    fiber._debugIsCurrentlyTiming = false;
303    endFiberMark(fiber, null, null);
304  }
305}
306
307export function stopFailedWorkTimer(fiber: Fiber): void {
308  if (enableUserTimingAPI) {
309    if (!supportsUserTiming || shouldIgnoreFiber(fiber)) {
310      return;
311    }
312    // If we pause, its parent is the fiber to unwind from.
313    currentFiber = fiber.return;
314    if (!fiber._debugIsCurrentlyTiming) {
315      return;
316    }
317    fiber._debugIsCurrentlyTiming = false;
318    const warning = 'An error was thrown inside this error boundary';
319    endFiberMark(fiber, null, warning);
320  }
321}
322
323export function startPhaseTimer(fiber: Fiber, phase: MeasurementPhase): void {
324  if (enableUserTimingAPI) {
325    if (!supportsUserTiming) {
326      return;
327    }
328    clearPendingPhaseMeasurement();
329    if (!beginFiberMark(fiber, phase)) {
330      return;
331    }
332    currentPhaseFiber = fiber;
333    currentPhase = phase;
334  }
335}
336
337export function stopPhaseTimer(): void {
338  if (enableUserTimingAPI) {
339    if (!supportsUserTiming) {
340      return;
341    }
342    if (currentPhase !== null && currentPhaseFiber !== null) {
343      const warning = hasScheduledUpdateInCurrentPhase
344        ? 'Scheduled a cascading update'
345        : null;
346      endFiberMark(currentPhaseFiber, currentPhase, warning);
347    }
348    currentPhase = null;
349    currentPhaseFiber = null;
350  }
351}
352
353export function startWorkLoopTimer(nextUnitOfWork: Fiber | null): void {
354  if (enableUserTimingAPI) {
355    currentFiber = nextUnitOfWork;
356    if (!supportsUserTiming) {
357      return;
358    }
359    commitCountInCurrentWorkLoop = 0;
360    // This is top level call.
361    // Any other measurements are performed within.
362    beginMark('(React Tree Reconciliation)');
363    // Resume any measurements that were in progress during the last loop.
364    resumeTimers();
365  }
366}
367
368export function stopWorkLoopTimer(
369  interruptedBy: Fiber | null,
370  didCompleteRoot: boolean,
371): void {
372  if (enableUserTimingAPI) {
373    if (!supportsUserTiming) {
374      return;
375    }
376    let warning = null;
377    if (interruptedBy !== null) {
378      if (interruptedBy.tag === HostRoot) {
379        warning = 'A top-level update interrupted the previous render';
380      } else {
381        const componentName = getComponentName(interruptedBy) || 'Unknown';
382        warning = `An update to ${componentName} interrupted the previous render`;
383      }
384    } else if (commitCountInCurrentWorkLoop > 1) {
385      warning = 'There were cascading updates';
386    }
387    commitCountInCurrentWorkLoop = 0;
388    let label = didCompleteRoot
389      ? '(React Tree Reconciliation: Completed Root)'
390      : '(React Tree Reconciliation: Yielded)';
391    // Pause any measurements until the next loop.
392    pauseTimers();
393    endMark(label, '(React Tree Reconciliation)', warning);
394  }
395}
396
397export function startCommitTimer(): void {
398  if (enableUserTimingAPI) {
399    if (!supportsUserTiming) {
400      return;
401    }
402    isCommitting = true;
403    hasScheduledUpdateInCurrentCommit = false;
404    labelsInCurrentCommit.clear();
405    beginMark('(Committing Changes)');
406  }
407}
408
409export function stopCommitTimer(): void {
410  if (enableUserTimingAPI) {
411    if (!supportsUserTiming) {
412      return;
413    }
414
415    let warning = null;
416    if (hasScheduledUpdateInCurrentCommit) {
417      warning = 'Lifecycle hook scheduled a cascading update';
418    } else if (commitCountInCurrentWorkLoop > 0) {
419      warning = 'Caused by a cascading update in earlier commit';
420    }
421    hasScheduledUpdateInCurrentCommit = false;
422    commitCountInCurrentWorkLoop++;
423    isCommitting = false;
424    labelsInCurrentCommit.clear();
425
426    endMark('(Committing Changes)', '(Committing Changes)', warning);
427  }
428}
429
430export function startCommitSnapshotEffectsTimer(): void {
431  if (enableUserTimingAPI) {
432    if (!supportsUserTiming) {
433      return;
434    }
435    effectCountInCurrentCommit = 0;
436    beginMark('(Committing Snapshot Effects)');
437  }
438}
439
440export function stopCommitSnapshotEffectsTimer(): void {
441  if (enableUserTimingAPI) {
442    if (!supportsUserTiming) {
443      return;
444    }
445    const count = effectCountInCurrentCommit;
446    effectCountInCurrentCommit = 0;
447    endMark(
448      `(Committing Snapshot Effects: ${count} Total)`,
449      '(Committing Snapshot Effects)',
450      null,
451    );
452  }
453}
454
455export function startCommitHostEffectsTimer(): void {
456  if (enableUserTimingAPI) {
457    if (!supportsUserTiming) {
458      return;
459    }
460    effectCountInCurrentCommit = 0;
461    beginMark('(Committing Host Effects)');
462  }
463}
464
465export function stopCommitHostEffectsTimer(): void {
466  if (enableUserTimingAPI) {
467    if (!supportsUserTiming) {
468      return;
469    }
470    const count = effectCountInCurrentCommit;
471    effectCountInCurrentCommit = 0;
472    endMark(
473      `(Committing Host Effects: ${count} Total)`,
474      '(Committing Host Effects)',
475      null,
476    );
477  }
478}
479
480export function startCommitLifeCyclesTimer(): void {
481  if (enableUserTimingAPI) {
482    if (!supportsUserTiming) {
483      return;
484    }
485    effectCountInCurrentCommit = 0;
486    beginMark('(Calling Lifecycle Methods)');
487  }
488}
489
490export function stopCommitLifeCyclesTimer(): void {
491  if (enableUserTimingAPI) {
492    if (!supportsUserTiming) {
493      return;
494    }
495    const count = effectCountInCurrentCommit;
496    effectCountInCurrentCommit = 0;
497    endMark(
498      `(Calling Lifecycle Methods: ${count} Total)`,
499      '(Calling Lifecycle Methods)',
500      null,
501    );
502  }
503}
504
Full Screen

Accelerate Your Automation Test Cycles With LambdaTest

Leverage LambdaTest’s cloud-based platform to execute your automation tests in parallel and trim down your test execution time significantly. Your first 100 automation testing minutes are on us.

Try LambdaTest

Run JavaScript Tests on LambdaTest Cloud Grid

Execute automation tests with Playwright Internal on a cloud-based Grid of 3000+ real browsers and operating systems for both web and mobile applications.

Test now for Free
LambdaTestX

We use cookies to give you the best experience. Cookies help to provide a more personalized experience and relevant advertising for you, and web analytics for us. Learn More in our Cookies policy, Privacy & Terms of service

Allow Cookie
Sarah

I hope you find the best code examples for your project.

If you want to accelerate automated browser testing, try LambdaTest. Your first 100 automation testing minutes are FREE.

Sarah Elson (Product & Growth Lead)