[react-events] Refine executeUserEventHandler (#16662)

Author: trueadm

packages/legacy-events/ReactGenericBatching.js

@@ -9,7 +9,9 @@ import {
   needsStateRestore,
   restoreStateIfNeeded,
 } from './ReactControlledComponent';
+
 import {enableFlareAPI} from 'shared/ReactFeatureFlags';
+import {invokeGuardedCallbackAndCatchFirstError} from 'shared/ReactErrorUtils';
 
 // Used as a way to call batchedUpdates when we don't have a reference to
 // the renderer. Such as when we're dispatching events or if third party
@@ -76,11 +78,12 @@ export function batchedEventUpdates(fn, a, b) {
 }
 
 // This is for the React Flare event system
-export function executeUserEventHandler(fn: any => void, value: any): any {
+export function executeUserEventHandler(fn: any => void, value: any): void {
   const previouslyInEventHandler = isInsideEventHandler;
   try {
     isInsideEventHandler = true;
-    return fn(value);
+    const type = typeof value === 'object' && value !== null ? value.type : '';
+    invokeGuardedCallbackAndCatchFirstError(type, fn, undefined, value);
   } finally {
     isInsideEventHandler = previouslyInEventHandler;
   }

packages/react-dom/src/events/DOMEventResponderSystem.js

@@ -92,27 +92,30 @@ const eventResponderContext: ReactDOMResponderContext = {
     eventValue: any,
     eventListener: any => void,
     eventPriority: EventPriority,
-  ): any {
+  ): void {
     validateResponderContext();
     validateEventValue(eventValue);
     switch (eventPriority) {
       case DiscreteEvent: {
         flushDiscreteUpdatesIfNeeded(currentTimeStamp);
-        return discreteUpdates(() =>
+        discreteUpdates(() =>
           executeUserEventHandler(eventListener, eventValue),
         );
+        break;
       }
       case UserBlockingEvent: {
         if (enableUserBlockingEvents) {
-          return runWithPriority(UserBlockingPriority, () =>
+          runWithPriority(UserBlockingPriority, () =>
             executeUserEventHandler(eventListener, eventValue),
           );
         } else {
-          return executeUserEventHandler(eventListener, eventValue);
+          executeUserEventHandler(eventListener, eventValue);
         }
+        break;
       }
       case ContinuousEvent: {
-        return executeUserEventHandler(eventListener, eventValue);
+        executeUserEventHandler(eventListener, eventValue);
+        break;
       }
     }
   },

packages/react-events/src/dom/Keyboard.js

@@ -173,11 +173,11 @@ function dispatchKeyboardEvent(
     type,
     defaultPrevented,
   );
-  const shouldPropagate = context.dispatchEvent(
-    syntheticEvent,
-    listener,
-    DiscreteEvent,
-  );
+  let shouldPropagate;
+  const listenerWithReturnValue = e => {
+    shouldPropagate = listener(e);
+  };
+  context.dispatchEvent(syntheticEvent, listenerWithReturnValue, DiscreteEvent);
   if (shouldPropagate) {
     context.continuePropagation();
   }