diff --git a/packages/react-dom/src/events/DOMPluginEventSystem.js b/packages/react-dom/src/events/DOMPluginEventSystem.js index 1b23cde2f35a..b11807fdca3e 100644 --- a/packages/react-dom/src/events/DOMPluginEventSystem.js +++ b/packages/react-dom/src/events/DOMPluginEventSystem.js @@ -709,7 +709,7 @@ export function accumulateSinglePhaseListeners( let instance = targetFiber; let lastHostComponent = null; - const targetType = event.type; + const targetType = event.nativeEvent.type; // Accumulate all instances and listeners via the target -> root path. while (instance !== null) { diff --git a/packages/react-dom/src/events/ReactSyntheticEventType.js b/packages/react-dom/src/events/ReactSyntheticEventType.js index f68fad1e0b6d..e37af02d162d 100644 --- a/packages/react-dom/src/events/ReactSyntheticEventType.js +++ b/packages/react-dom/src/events/ReactSyntheticEventType.js @@ -29,6 +29,7 @@ export type ReactSyntheticEvent = {| _dispatchListeners?: null | Array | Function, _reactName: string, _targetInst: Fiber, + nativeEvent: Event, type: string, currentTarget: null | EventTarget, |}; diff --git a/packages/react-interactions/events/src/dom/create-event-handle/Focus.js b/packages/react-interactions/events/src/dom/create-event-handle/Focus.js index bcac5e6d93c1..53e04c1ca846 100644 --- a/packages/react-interactions/events/src/dom/create-event-handle/Focus.js +++ b/packages/react-interactions/events/src/dom/create-event-handle/Focus.js @@ -200,8 +200,8 @@ export function useFocus( const stateRef = useRef( {isFocused: false, isFocusVisible: false}, ); - const focusHandle = useEvent('focus', passiveObjectWithPriority); - const blurHandle = useEvent('blur', passiveObjectWithPriority); + const focusHandle = useEvent('focusin', passiveObjectWithPriority); + const blurHandle = useEvent('focusout', passiveObjectWithPriority); const focusVisibleHandles = useFocusVisibleInputHandles(); useLayoutEffect(() => { @@ -297,8 +297,8 @@ export function useFocusWithin( const stateRef = useRef( {isFocused: false, isFocusVisible: false}, ); - const focusHandle = useEvent('focus', passiveObjectWithPriority); - const blurHandle = useEvent('blur', passiveObjectWithPriority); + const focusHandle = useEvent('focusin', passiveObjectWithPriority); + const blurHandle = useEvent('focusout', passiveObjectWithPriority); const afterBlurHandle = useEvent('afterblur', passiveObject); const beforeBlurHandle = useEvent('beforeblur', passiveObject); const focusVisibleHandles = useFocusVisibleInputHandles(); diff --git a/packages/react-interactions/events/src/dom/create-event-handle/__tests__/useFocus-test.internal.js b/packages/react-interactions/events/src/dom/create-event-handle/__tests__/useFocus-test.internal.js index f3bae7717b8c..d8f8f3c7d31b 100644 --- a/packages/react-interactions/events/src/dom/create-event-handle/__tests__/useFocus-test.internal.js +++ b/packages/react-interactions/events/src/dom/create-event-handle/__tests__/useFocus-test.internal.js @@ -91,7 +91,7 @@ describe.each(table)(`useFocus hasPointerEvents=%s`, hasPointerEvents => { useFocus(ref, { onBlur, }); - return
{}} onFocus={() => {}} />; + return