Delegated all capture events (#19463)

facebook · Jul 27, 2020 · 6bb86fd · 6bb86fd
1 parent 05344fa
commit 6bb86fd
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 19 deletions.
diff --git a/packages/react-dom/src/events/DOMPluginEventSystem.js b/packages/react-dom/src/events/DOMPluginEventSystem.js
@@ -373,9 +373,15 @@ export function listenToNativeEvent(
   if (topLevelType === TOP_SELECTION_CHANGE) {
     target = (rootContainerElement: any).ownerDocument;
   }
-  // If the event can be delegated, we can register it to the root container.
-  // Otherwise, we should register the event to the target element.
-  if (targetElement !== null && nonDelegatedEvents.has(topLevelType)) {
+  // If the event can be delegated (or is capture phase), we can
+  // register it to the root container. Otherwise, we should
+  // register the event to the target element and mark it as
+  // a non-delegated event.
+  if (
+    targetElement !== null &&
+    !isCapturePhaseListener &&
+    nonDelegatedEvents.has(topLevelType)
+  ) {
     eventSystemFlags |= IS_NON_DELEGATED;
     target = targetElement;
   }

diff --git a/packages/react-dom/src/events/plugins/SimpleEventPlugin.js b/packages/react-dom/src/events/plugins/SimpleEventPlugin.js
@@ -40,10 +40,9 @@ import {
 import {IS_EVENT_HANDLE_NON_MANAGED_NODE} from '../EventSystemFlags';
 
 import getEventCharCode from '../getEventCharCode';
-import {IS_CAPTURE_PHASE, IS_NON_DELEGATED} from '../EventSystemFlags';
+import {IS_CAPTURE_PHASE} from '../EventSystemFlags';
 
 import {enableCreateEventHandleAPI} from 'shared/ReactFeatureFlags';
-import {getClosestInstanceFromNode} from '../../client/ReactDOMComponentTree';
 
 function extractEvents(
   dispatchQueue: DispatchQueue,
@@ -166,22 +165,11 @@ function extractEvents(
       inCapturePhase,
     );
   } else {
-    // When we encounter a non-delegated event in the capture phase,
-    // we shouldn't emuluate capture bubbling. This is because we'll
-    // add a native capture event listener to each element directly,
-    // not the root, and native capture listeners always fire even
-    // if the event doesn't bubble.
-    const isNonDelegatedEvent = (eventSystemFlags & IS_NON_DELEGATED) !== 0;
     // TODO: We may also want to re-use the accumulateTargetOnly flag to
     // special case bubbling for onScroll/media events at a later point.
-    const accumulateTargetOnly = inCapturePhase && isNonDelegatedEvent;
-    // If we are not handling accumulateTargetOnly, then we should traverse
-    // through all React fiber tree, finding all relevant useEvent and
-    // on* prop events as we traverse the tree. Otherwise, we should
-    // only handle the target fiber and stop traversal straight after.
-    if (accumulateTargetOnly) {
-      targetInst = getClosestInstanceFromNode(((targetContainer: any): Node));
-    }
+    // In which case we will want to make this flag boolean and ensure
+    // we change the targetInst to be of the container instance. Like:
+    const accumulateTargetOnly = false;
 
     // We traverse only capture or bubble phase listeners
     accumulateSinglePhaseListeners(