extractEvents() — react Function Reference

Architecture documentation for the extractEvents() function in SelectEventPlugin.js from the react codebase.

Function javascript BabelCompiler Validation calls 2

Entity Profile

BabelCompiler→ Validation→ extractEvents() — react Function Reference

Dependency Diagram

graph TD
  883c6b61_d9b7_7c94_1745_bb9ecdd3ccdb["extractEvents()"]
  b8a5c95d_02fb_4719_0efd_4463f2546996["SelectEventPlugin.js"]
  883c6b61_d9b7_7c94_1745_bb9ecdd3ccdb -->|defined in| b8a5c95d_02fb_4719_0efd_4463f2546996
  e68ee20d_0906_0494_d1c4_4f9c91467ead["extractEvents()"]
  883c6b61_d9b7_7c94_1745_bb9ecdd3ccdb -->|calls| e68ee20d_0906_0494_d1c4_4f9c91467ead
  4c50b416_304e_a759_8f8d_e22e46f2d54d["constructSelectEvent()"]
  883c6b61_d9b7_7c94_1745_bb9ecdd3ccdb -->|calls| 4c50b416_304e_a759_8f8d_e22e46f2d54d
  style 883c6b61_d9b7_7c94_1745_bb9ecdd3ccdb fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/react-dom-bindings/src/events/plugins/SelectEventPlugin.js lines 150–207

function extractEvents(
  dispatchQueue: DispatchQueue,
  domEventName: DOMEventName,
  targetInst: null | Fiber,
  nativeEvent: AnyNativeEvent,
  nativeEventTarget: null | EventTarget,
  eventSystemFlags: EventSystemFlags,
  targetContainer: EventTarget,
) {
  const targetNode = targetInst ? getNodeFromInstance(targetInst) : window;

  switch (domEventName) {
    // Track the input node that has focus.
    case 'focusin':
      if (
        isTextInputElement((targetNode: any)) ||
        targetNode.contentEditable === 'true'
      ) {
        activeElement = targetNode;
        activeElementInst = targetInst;
        lastSelection = null;
      }
      break;
    case 'focusout':
      activeElement = null;
      activeElementInst = null;
      lastSelection = null;
      break;
    // Don't fire the event while the user is dragging. This matches the
    // semantics of the native select event.
    case 'mousedown':
      mouseDown = true;
      break;
    case 'contextmenu':
    case 'mouseup':
    case 'dragend':
      mouseDown = false;
      constructSelectEvent(dispatchQueue, nativeEvent, nativeEventTarget);
      break;
    // Chrome and IE fire non-standard event when selection is changed (and
    // sometimes when it hasn't). IE's event fires out of order with respect
    // to key and input events on deletion, so we discard it.
    //
    // Firefox doesn't support selectionchange, so check selection status
    // after each key entry. The selection changes after keydown and before
    // keyup, but we check on keydown as well in the case of holding down a
    // key, when multiple keydown events are fired but only one keyup is.
    // This is also our approach for IE handling, for the reason above.
    case 'selectionchange':
      if (skipSelectionChangeEvent) {
        break;
      }
    // falls through
    case 'keydown':
    case 'keyup':
      constructSelectEvent(dispatchQueue, nativeEvent, nativeEventTarget);
  }
}