How to use setCurrentUpdateLanePriority 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.

SchedulerWithReactIntegration.js

Source: SchedulerWithReactIntegration.js Github

copy
1import * as Scheduler from '../SCHEDULER/Scheduler'
2import { decoupleUpdatePriorityFromScheduler } from '../shared/ReactFeatureFlags';
3import { getCurrentUpdateLanePriority, setCurrentUpdateLanePriority, SyncLanePriority } from './ReactFiberLane';
4
5const {
6  unstable_runWithPriority: Scheduler_runWithPriority,
7  unstable_getCurrentPriorityLevel: Scheduler_getCurrentPriorityLevel,
8  unstable_cancelCallback: Scheduler_cancelCallback,
9  unstable_scheduleCallback: Scheduler_scheduleCallback,
10  unstable_ImmediatePriority: Scheduler_ImmediatePriority,
11  unstable_UserBlockingPriority: Scheduler_UserBlockingPriority,
12  unstable_NormalPriority: Scheduler_NormalPriority,
13  unstable_LowPriority: Scheduler_LowPriority,
14  unstable_IdlePriority: Scheduler_IdlePriority,
15  unstable_now: Scheduler_now
16} = Scheduler;
17
18const fakeCallbackNode = {};
19let syncQueue = null;
20let immediateQueueCallbackNode = null;
21let isFlushingSyncQueue = false;
22const initialTimeMs = Scheduler_now();
23
24export const now =
25  initialTimeMs < 10000 ? Scheduler_now : () => Scheduler_now() - initialTimeMs;
26
27
28
29
30// Except for NoPriority, these correspond to Scheduler priorities. We use
31// ascending numbers so we can compare them like numbers. They start at 90 to
32// avoid clashing with Scheduler's priorities.
33export const ImmediatePriority = 99;
34export const UserBlockingPriority = 98;
35export const NormalPriority = 97;
36export const LowPriority = 96;
37export const IdlePriority = 95;
38// NoPriority is the absence of priority. Also React-only.
39export const NoPriority = 90;
40
41export function getCurrentPriorityLevel() {
42  switch(Scheduler_getCurrentPriorityLevel()) {
43    case Scheduler_ImmediatePriority:
44      return ImmediatePriority;
45    case Scheduler_UserBlockingPriority:
46      return UserBlockingPriority;
47    case Scheduler_NormalPriority:
48      return NormalPriority;
49    case Scheduler_LowPriority:
50      return LowPriority;
51    case Scheduler_IdlePriority:
52      return IdlePriority;
53    default:
54      return 'unknowPriority';
55  }
56}
57
58
59function reactPriorityToSchedulerPriority(reactPriorityLevel) {
60  switch(reactPriorityLevel) {
61    case ImmediatePriority:
62      return Scheduler_ImmediatePriority;
63    case UserBlockingPriority:
64      return Scheduler_UserBlockingPriority;
65    case NormalPriority:
66      return Scheduler_NormalPriority;
67    case LowPriority:
68      return Scheduler_LowPriority;
69    case IdlePriority:
70      return Scheduler_IdlePriority;
71    default:
72      return 'unknowPriority';
73  }
74}
75
76export function runWithPriority(reactPriorityLevel, fn) {
77  const priorityLevel = reactPriorityToSchedulerPriority(reactPriorityLevel);
78  return Scheduler_runWithPriority(priorityLevel, fn);
79}
80
81export function scheduleCallback(reactPriorityLevel, callback, options) {
82  const priorityLevel = reactPriorityToSchedulerPriority(reactPriorityLevel);
83  return Scheduler_scheduleCallback(priorityLevel, callback, options);
84}
85
86export function flushSyncCallbackQueue() {
87  if(immediateQueueCallbackNode !== null) {
88    const node = immediateQueueCallbackNode; 
89    immediateQueueCallbackNode = null;
90    Scheduler_cancelCallback(node);
91  }
92
93  flushSyncCallbackQueueImpl();
94}
95
96export function cancelCallback(callbackNode) {
97  if(callbackNode !== fakeCallbackNode) {
98    Scheduler_cancelCallback(callbackNode);
99  }
100}
101
102export function scheduleSyncCallback(callback) {
103  if(syncQueue === null) {
104    syncQueue = [callback];
105    immediateQueueCallbackNode = Scheduler_scheduleCallback(
106      Scheduler_ImmediatePriority,
107      flushSyncCallbackQueueImpl,
108    );
109  } else {
110    syncQueue.push(callback);
111  }
112
113  return fakeCallbackNode;
114}
115
116function flushSyncCallbackQueueImpl() {
117  if(!isFlushingSyncQueue && syncQueue !== null) {
118    isFlushingSyncQueue = true;
119    let i = 0;
120    if(decoupleUpdatePriorityFromScheduler) {
121      const previousLanePriority = getCurrentUpdateLanePriority();
122      try {
123        const isSync = true;
124        const queue = syncQueue;
125        setCurrentUpdateLanePriority(SyncLanePriority);
126        runWithPriority(
127          ImmediatePriority,
128          () => {
129            for(; i < queue.length; i++) {
130              let callback = queue[i];
131              do{
132                callback = callback(isSync);
133              } while(callback !== null)
134            }
135          }
136        );
137        syncQueue = null;
138      } catch(err) {
139        
140      } finally {
141        setCurrentUpdateLanePriority(previousLanePriority);
142        isFlushingSyncQueue = false;
143      }
144    } else {
145      try {
146        const isSync = true;
147        const queue = syncQueue;
148        runWithPriority(
149          ImmediatePriority,
150          () => {
151            for(; i < queue.length; i++) {
152              let callback = queue[i];
153              do{
154                callback = callback(isSync);
155              } while(callback !== null)
156            }
157          }
158        );
159        syncQueue = null;
160      } catch(err) {
161
162      } finally {
163        isFlushingSyncQueue = false;
164      }
165    }
166    return true;
167  } else {
168    return false;
169  }
170}
Full Screen

ReactDOMEventListener.js

Source: ReactDOMEventListener.js Github

copy
1/**
2 * Copyright (c) Facebook, Inc. and its affiliates.
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 {AnyNativeEvent} from '../events/PluginModuleType';
11import type {FiberRoot} from 'react-reconciler/src/ReactInternalTypes';
12import type {Container, SuspenseInstance} from '../client/ReactDOMHostConfig';
13import type {DOMEventName} from '../events/DOMEventNames';
14
15// Intentionally not named imports because Rollup would use dynamic dispatch for
16// CommonJS interop named imports.
17import * as Scheduler from 'scheduler';
18
19import {
20  isReplayableDiscreteEvent,
21  queueDiscreteEvent,
22  hasQueuedDiscreteEvents,
23  clearIfContinuousEvent,
24  queueIfContinuousEvent,
25} from './ReactDOMEventReplaying';
26import {
27  getNearestMountedFiber,
28  getContainerFromFiber,
29  getSuspenseInstanceFromFiber,
30} from 'react-reconciler/src/ReactFiberTreeReflection';
31import {HostRoot, SuspenseComponent} from 'react-reconciler/src/ReactWorkTags';
32import {
33  type EventSystemFlags,
34  IS_CAPTURE_PHASE,
35  IS_LEGACY_FB_SUPPORT_MODE,
36} from './EventSystemFlags';
37
38import getEventTarget from './getEventTarget';
39import {getClosestInstanceFromNode} from '../client/ReactDOMComponentTree';
40
41import {
42  enableLegacyFBSupport,
43  decoupleUpdatePriorityFromScheduler,
44  enableNewReconciler,
45} from 'shared/ReactFeatureFlags';
46import {
47  UserBlockingEvent,
48  ContinuousEvent,
49  DiscreteEvent,
50} from 'shared/ReactTypes';
51import {getEventPriorityForPluginSystem} from './DOMEventProperties';
52import {dispatchEventForPluginEventSystem} from './DOMPluginEventSystem';
53import {
54  flushDiscreteUpdatesIfNeeded,
55  discreteUpdates,
56} from './ReactDOMUpdateBatching';
57
58import {
59  InputContinuousLanePriority as InputContinuousLanePriority_old,
60  getCurrentUpdateLanePriority as getCurrentUpdateLanePriority_old,
61  setCurrentUpdateLanePriority as setCurrentUpdateLanePriority_old,
62} from 'react-reconciler/src/ReactFiberLane.old';
63import {
64  InputContinuousLanePriority as InputContinuousLanePriority_new,
65  getCurrentUpdateLanePriority as getCurrentUpdateLanePriority_new,
66  setCurrentUpdateLanePriority as setCurrentUpdateLanePriority_new,
67} from 'react-reconciler/src/ReactFiberLane.new';
68
69const InputContinuousLanePriority = enableNewReconciler
70  ? InputContinuousLanePriority_new
71  : InputContinuousLanePriority_old;
72const getCurrentUpdateLanePriority = enableNewReconciler
73  ? getCurrentUpdateLanePriority_new
74  : getCurrentUpdateLanePriority_old;
75const setCurrentUpdateLanePriority = enableNewReconciler
76  ? setCurrentUpdateLanePriority_new
77  : setCurrentUpdateLanePriority_old;
78
79const {
80  unstable_UserBlockingPriority: UserBlockingPriority,
81  unstable_runWithPriority: runWithPriority,
82} = Scheduler;
83
84// TODO: can we stop exporting these?
85export let _enabled = true;
86
87// This is exported in FB builds for use by legacy FB layer infra.
88// We'd like to remove this but it's not clear if this is safe.
89export function setEnabled(enabled: ?boolean) {
90  _enabled = !!enabled;
91}
92
93export function isEnabled() {
94  return _enabled;
95}
96
97export function createEventListenerWrapper(
98  targetContainer: EventTarget,
99  domEventName: DOMEventName,
100  eventSystemFlags: EventSystemFlags,
101): Function {
102  return dispatchEvent.bind(
103    null,
104    domEventName,
105    eventSystemFlags,
106    targetContainer,
107  );
108}
109
110export function createEventListenerWrapperWithPriority(
111  targetContainer: EventTarget,
112  domEventName: DOMEventName,
113  eventSystemFlags: EventSystemFlags,
114): Function {
115  const eventPriority = getEventPriorityForPluginSystem(domEventName);
116  let listenerWrapper;
117  switch (eventPriority) {
118    case DiscreteEvent:
119      listenerWrapper = dispatchDiscreteEvent;
120      break;
121    case UserBlockingEvent:
122      listenerWrapper = dispatchUserBlockingUpdate;
123      break;
124    case ContinuousEvent:
125    default:
126      listenerWrapper = dispatchEvent;
127      break;
128  }
129  return listenerWrapper.bind(
130    null,
131    domEventName,
132    eventSystemFlags,
133    targetContainer,
134  );
135}
136
137function dispatchDiscreteEvent(
138  domEventName,
139  eventSystemFlags,
140  container,
141  nativeEvent,
142) {
143  if (
144    !enableLegacyFBSupport ||
145    // If we are in Legacy FB support mode, it means we've already
146    // flushed for this event and we don't need to do it again.
147    (eventSystemFlags & IS_LEGACY_FB_SUPPORT_MODE) === 0
148  ) {
149    flushDiscreteUpdatesIfNeeded(nativeEvent.timeStamp);
150  }
151  discreteUpdates(
152    dispatchEvent,
153    domEventName,
154    eventSystemFlags,
155    container,
156    nativeEvent,
157  );
158}
159
160function dispatchUserBlockingUpdate(
161  domEventName,
162  eventSystemFlags,
163  container,
164  nativeEvent,
165) {
166  if (decoupleUpdatePriorityFromScheduler) {
167    const previousPriority = getCurrentUpdateLanePriority();
168    try {
169      // TODO: Double wrapping is necessary while we decouple Scheduler priority.
170      setCurrentUpdateLanePriority(InputContinuousLanePriority);
171      runWithPriority(
172        UserBlockingPriority,
173        dispatchEvent.bind(
174          null,
175          domEventName,
176          eventSystemFlags,
177          container,
178          nativeEvent,
179        ),
180      );
181    } finally {
182      setCurrentUpdateLanePriority(previousPriority);
183    }
184  } else {
185    runWithPriority(
186      UserBlockingPriority,
187      dispatchEvent.bind(
188        null,
189        domEventName,
190        eventSystemFlags,
191        container,
192        nativeEvent,
193      ),
194    );
195  }
196}
197
198export function dispatchEvent(
199  domEventName: DOMEventName,
200  eventSystemFlags: EventSystemFlags,
201  targetContainer: EventTarget,
202  nativeEvent: AnyNativeEvent,
203): void {
204  if (!_enabled) {
205    return;
206  }
207
208  // TODO: replaying capture phase events is currently broken
209  // because we used to do it during top-level native bubble handlers
210  // but now we use different bubble and capture handlers.
211  // In eager mode, we attach capture listeners early, so we need
212  // to filter them out until we fix the logic to handle them correctly.
213  const allowReplay = (eventSystemFlags & IS_CAPTURE_PHASE) === 0;
214
215  if (
216    allowReplay &&
217    hasQueuedDiscreteEvents() &&
218    isReplayableDiscreteEvent(domEventName)
219  ) {
220    // If we already have a queue of discrete events, and this is another discrete
221    // event, then we can't dispatch it regardless of its target, since they
222    // need to dispatch in order.
223    queueDiscreteEvent(
224      null, // Flags that we're not actually blocked on anything as far as we know.
225      domEventName,
226      eventSystemFlags,
227      targetContainer,
228      nativeEvent,
229    );
230    return;
231  }
232
233  const blockedOn = attemptToDispatchEvent(
234    domEventName,
235    eventSystemFlags,
236    targetContainer,
237    nativeEvent,
238  );
239
240  if (blockedOn === null) {
241    // We successfully dispatched this event.
242    if (allowReplay) {
243      clearIfContinuousEvent(domEventName, nativeEvent);
244    }
245    return;
246  }
247
248  if (allowReplay) {
249    if (isReplayableDiscreteEvent(domEventName)) {
250      // This this to be replayed later once the target is available.
251      queueDiscreteEvent(
252        blockedOn,
253        domEventName,
254        eventSystemFlags,
255        targetContainer,
256        nativeEvent,
257      );
258      return;
259    }
260    if (
261      queueIfContinuousEvent(
262        blockedOn,
263        domEventName,
264        eventSystemFlags,
265        targetContainer,
266        nativeEvent,
267      )
268    ) {
269      return;
270    }
271    // We need to clear only if we didn't queue because
272    // queueing is accumulative.
273    clearIfContinuousEvent(domEventName, nativeEvent);
274  }
275
276  // This is not replayable so we'll invoke it but without a target,
277  // in case the event system needs to trace it.
278  dispatchEventForPluginEventSystem(
279    domEventName,
280    eventSystemFlags,
281    nativeEvent,
282    null,
283    targetContainer,
284  );
285}
286
287// Attempt dispatching an event. Returns a SuspenseInstance or Container if it's blocked.
288export function attemptToDispatchEvent(
289  domEventName: DOMEventName,
290  eventSystemFlags: EventSystemFlags,
291  targetContainer: EventTarget,
292  nativeEvent: AnyNativeEvent,
293): null | Container | SuspenseInstance {
294  // TODO: Warn if _enabled is false.
295
296  const nativeEventTarget = getEventTarget(nativeEvent);
297  let targetInst = getClosestInstanceFromNode(nativeEventTarget);
298
299  if (targetInst !== null) {
300    const nearestMounted = getNearestMountedFiber(targetInst);
301    if (nearestMounted === null) {
302      // This tree has been unmounted already. Dispatch without a target.
303      targetInst = null;
304    } else {
305      const tag = nearestMounted.tag;
306      if (tag === SuspenseComponent) {
307        const instance = getSuspenseInstanceFromFiber(nearestMounted);
308        if (instance !== null) {
309          // Queue the event to be replayed later. Abort dispatching since we
310          // don't want this event dispatched twice through the event system.
311          // TODO: If this is the first discrete event in the queue. Schedule an increased
312          // priority for this boundary.
313          return instance;
314        }
315        // This shouldn't happen, something went wrong but to avoid blocking
316        // the whole system, dispatch the event without a target.
317        // TODO: Warn.
318        targetInst = null;
319      } else if (tag === HostRoot) {
320        const root: FiberRoot = nearestMounted.stateNode;
321        if (root.hydrate) {
322          // If this happens during a replay something went wrong and it might block
323          // the whole system.
324          return getContainerFromFiber(nearestMounted);
325        }
326        targetInst = null;
327      } else if (nearestMounted !== targetInst) {
328        // If we get an event (ex: img onload) before committing that
329        // component's mount, ignore it for now (that is, treat it as if it was an
330        // event on a non-React tree). We might also consider queueing events and
331        // dispatching them after the mount.
332        targetInst = null;
333      }
334    }
335  }
336  dispatchEventForPluginEventSystem(
337    domEventName,
338    eventSystemFlags,
339    nativeEvent,
340    targetInst,
341    targetContainer,
342  );
343  // We're not blocked on anything.
344  return null;
345}
346
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)