How to use trapEventForPluginEventSystem method in Playwright Internal

1  var UserBlockingPriority = unstable_UserBlockingPriority,
2      runWithPriority = unstable_runWithPriority; // TODO: can we stop exporting these?
3
4  var _enabled = true;
5  function setEnabled(enabled) {
6    _enabled = !!enabled;
7  }
8  function isEnabled() {
9    return _enabled;
10  }
11  function trapBubbledEvent(topLevelType, element) {
12    trapEventForPluginEventSystem(element, topLevelType, false);
13  }
14  function trapCapturedEvent(topLevelType, element) {
15    trapEventForPluginEventSystem(element, topLevelType, true);
16  }
17
18  function trapEventForPluginEventSystem(container, topLevelType, capture) {
19    var listener;
20
21    switch (getEventPriorityForPluginSystem(topLevelType)) {
22      case DiscreteEvent:
23        listener = dispatchDiscreteEvent.bind(null, topLevelType, PLUGIN_EVENT_SYSTEM, container);
24        break;
25
26      case UserBlockingEvent:
27        listener = dispatchUserBlockingUpdate.bind(null, topLevelType, PLUGIN_EVENT_SYSTEM, container);
28        break;
29
30      case ContinuousEvent:
31      default:
32        listener = dispatchEvent.bind(null, topLevelType, PLUGIN_EVENT_SYSTEM, container);
33        break;
34    }
35
36    var rawEventName = getRawEventName(topLevelType);
37
38    if (capture) {
39      addEventCaptureListener(container, rawEventName, listener);
40    } else {
41      addEventBubbleListener(container, rawEventName, listener);
42    }
43  }
44
45  function dispatchDiscreteEvent(topLevelType, eventSystemFlags, container, nativeEvent) {
46    flushDiscreteUpdatesIfNeeded(nativeEvent.timeStamp);
47    discreteUpdates(dispatchEvent, topLevelType, eventSystemFlags, container, nativeEvent);
48  }
49
50  function dispatchUserBlockingUpdate(topLevelType, eventSystemFlags, container, nativeEvent) {
51    runWithPriority(UserBlockingPriority, dispatchEvent.bind(null, topLevelType, eventSystemFlags, container, nativeEvent));
52  }
53
54  function dispatchEvent(topLevelType, eventSystemFlags, container, nativeEvent) {
55    if (!_enabled) {
56      return;
57    }
58
59    if (hasQueuedDiscreteEvents() && isReplayableDiscreteEvent(topLevelType)) {
60      // If we already have a queue of discrete events, and this is another discrete
61      // event, then we can't dispatch it regardless of its target, since they
62      // need to dispatch in order.
63      queueDiscreteEvent(null, // Flags that we're not actually blocked on anything as far as we know.
64      topLevelType, eventSystemFlags, container, nativeEvent);
65      return;
66    }
67
68    var blockedOn = attemptToDispatchEvent(topLevelType, eventSystemFlags, container, nativeEvent);
69
70    if (blockedOn === null) {
71      // We successfully dispatched this event.
72      clearIfContinuousEvent(topLevelType, nativeEvent);
73      return;
74    }
75
76    if (isReplayableDiscreteEvent(topLevelType)) {
77      // This this to be replayed later once the target is available.
78      queueDiscreteEvent(blockedOn, topLevelType, eventSystemFlags, container, nativeEvent);
79      return;
80    }
81
82    if (queueIfContinuousEvent(blockedOn, topLevelType, eventSystemFlags, container, nativeEvent)) {
83      return;
84    } // We need to clear only if we didn't queue because
85    // queueing is accummulative.
86
87
88    clearIfContinuousEvent(topLevelType, nativeEvent); // This is not replayable so we'll invoke it but without a target,
89    // in case the event system needs to trace it.
90
91    {
92      dispatchEventForLegacyPluginEventSystem(topLevelType, eventSystemFlags, nativeEvent, null);
93    }
94  } // Attempt dispatching an event. Returns a SuspenseInstance or Container if it's blocked.
95
96  function attemptToDispatchEvent(topLevelType, eventSystemFlags, container, nativeEvent) {
97    // TODO: Warn if _enabled is false.
98    var nativeEventTarget = getEventTarget(nativeEvent);
99    var targetInst = getClosestInstanceFromNode(nativeEventTarget);
100
101    if (targetInst !== null) {
102      var nearestMounted = getNearestMountedFiber(targetInst);
103
104      if (nearestMounted === null) {
105        // This tree has been unmounted already. Dispatch without a target.
106        targetInst = null;
107      } else {
108        var tag = nearestMounted.tag;
109
110        if (tag === SuspenseComponent) {
111          var instance = getSuspenseInstanceFromFiber(nearestMounted);
112
113          if (instance !== null) {
114            // Queue the event to be replayed later. Abort dispatching since we
115            // don't want this event dispatched twice through the event system.
116            // TODO: If this is the first discrete event in the queue. Schedule an increased
117            // priority for this boundary.
118            return instance;
119          } // This shouldn't happen, something went wrong but to avoid blocking
120          // the whole system, dispatch the event without a target.
121          // TODO: Warn.
122
123
124          targetInst = null;
125        } else if (tag === HostRoot) {
126          var root = nearestMounted.stateNode;
127
128          if (root.hydrate) {
129            // If this happens during a replay something went wrong and it might block
130            // the whole system.
131            return getContainerFromFiber(nearestMounted);
132          }
133
134          targetInst = null;
135        } else if (nearestMounted !== targetInst) {
136          // If we get an event (ex: img onload) before committing that
137          // component's mount, ignore it for now (that is, treat it as if it was an
138          // event on a non-React tree). We might also consider queueing events and
139          // dispatching them after the mount.
140          targetInst = null;
141        }
142      }
143    }
144
145    {
146      dispatchEventForLegacyPluginEventSystem(topLevelType, eventSystemFlags, nativeEvent, targetInst);
147    } // We're not blocked on anything.
148
149
150    return null;
151  }

Source: ReactDOMEventListener.js

  var UserBlockingPriority = unstable_UserBlockingPriority,
      runWithPriority = unstable_runWithPriority; // TODO: can we stop exporting these?

  var _enabled = true;
  function setEnabled(enabled) {
    _enabled = !!enabled;
  }
  function isEnabled() {
    return _enabled;
  }
  function trapBubbledEvent(topLevelType, element) {
    trapEventForPluginEventSystem(element, topLevelType, false);
  }
  function trapCapturedEvent(topLevelType, element) {
    trapEventForPluginEventSystem(element, topLevelType, true);
  }

  function trapEventForPluginEventSystem(container, topLevelType, capture) {
    var listener;

    switch (getEventPriorityForPluginSystem(topLevelType)) {
      case DiscreteEvent:
        listener = dispatchDiscreteEvent.bind(null, topLevelType, PLUGIN_EVENT_SYSTEM, container);
        break;

      case UserBlockingEvent:
        listener = dispatchUserBlockingUpdate.bind(null, topLevelType, PLUGIN_EVENT_SYSTEM, container);
        break;

      case ContinuousEvent:
      default:
        listener = dispatchEvent.bind(null, topLevelType, PLUGIN_EVENT_SYSTEM, container);
        break;
    }

    var rawEventName = getRawEventName(topLevelType);

    if (capture) {
      addEventCaptureListener(container, rawEventName, listener);
    } else {
      addEventBubbleListener(container, rawEventName, listener);
    }
  }

  function dispatchDiscreteEvent(topLevelType, eventSystemFlags, container, nativeEvent) {
    flushDiscreteUpdatesIfNeeded(nativeEvent.timeStamp);
    discreteUpdates(dispatchEvent, topLevelType, eventSystemFlags, container, nativeEvent);
  }

  function dispatchUserBlockingUpdate(topLevelType, eventSystemFlags, container, nativeEvent) {
    runWithPriority(UserBlockingPriority, dispatchEvent.bind(null, topLevelType, eventSystemFlags, container, nativeEvent));
  }

  function dispatchEvent(topLevelType, eventSystemFlags, container, nativeEvent) {
    if (!_enabled) {
      return;
    }

    if (hasQueuedDiscreteEvents() && isReplayableDiscreteEvent(topLevelType)) {
      // If we already have a queue of discrete events, and this is another discrete
      // event, then we can't dispatch it regardless of its target, since they
      // need to dispatch in order.
      queueDiscreteEvent(null, // Flags that we're not actually blocked on anything as far as we know.
      topLevelType, eventSystemFlags, container, nativeEvent);
      return;
    }

    var blockedOn = attemptToDispatchEvent(topLevelType, eventSystemFlags, container, nativeEvent);

    if (blockedOn === null) {
      // We successfully dispatched this event.
      clearIfContinuousEvent(topLevelType, nativeEvent);
      return;
    }

    if (isReplayableDiscreteEvent(topLevelType)) {
      // This this to be replayed later once the target is available.
      queueDiscreteEvent(blockedOn, topLevelType, eventSystemFlags, container, nativeEvent);
      return;
    }

    if (queueIfContinuousEvent(blockedOn, topLevelType, eventSystemFlags, container, nativeEvent)) {
      return;
    } // We need to clear only if we didn't queue because
    // queueing is accummulative.


    clearIfContinuousEvent(topLevelType, nativeEvent); // This is not replayable so we'll invoke it but without a target,
    // in case the event system needs to trace it.

    {
      dispatchEventForLegacyPluginEventSystem(topLevelType, eventSystemFlags, nativeEvent, null);
    }
  } // Attempt dispatching an event. Returns a SuspenseInstance or Container if it's blocked.

  function attemptToDispatchEvent(topLevelType, eventSystemFlags, container, nativeEvent) {
    // TODO: Warn if _enabled is false.
    var nativeEventTarget = getEventTarget(nativeEvent);
    var targetInst = getClosestInstanceFromNode(nativeEventTarget);

    if (targetInst !== null) {
      var nearestMounted = getNearestMountedFiber(targetInst);

      if (nearestMounted === null) {
        // This tree has been unmounted already. Dispatch without a target.
        targetInst = null;
      } else {
        var tag = nearestMounted.tag;

        if (tag === SuspenseComponent) {
          var instance = getSuspenseInstanceFromFiber(nearestMounted);

          if (instance !== null) {
            // Queue the event to be replayed later. Abort dispatching since we
            // don't want this event dispatched twice through the event system.
            // TODO: If this is the first discrete event in the queue. Schedule an increased
            // priority for this boundary.
            return instance;
          } // This shouldn't happen, something went wrong but to avoid blocking
          // the whole system, dispatch the event without a target.
          // TODO: Warn.


          targetInst = null;
        } else if (tag === HostRoot) {
          var root = nearestMounted.stateNode;

          if (root.hydrate) {
            // If this happens during a replay something went wrong and it might block
            // the whole system.
            return getContainerFromFiber(nearestMounted);
          }

          targetInst = null;
        } else if (nearestMounted !== targetInst) {
          // If we get an event (ex: img onload) before committing that
          // component's mount, ignore it for now (that is, treat it as if it was an
          // event on a non-React tree). We might also consider queueing events and
          // dispatching them after the mount.
          targetInst = null;
        }
      }
    }

    {
      dispatchEventForLegacyPluginEventSystem(topLevelType, eventSystemFlags, nativeEvent, targetInst);
    } // We're not blocked on anything.


    return null;
  }