diff --git a/packages/react-interactions/events/src/dom/Press.js b/packages/react-interactions/events/src/dom/Press.js index f4a42ef896709..fc2bf93c1c67c 100644 --- a/packages/react-interactions/events/src/dom/Press.js +++ b/packages/react-interactions/events/src/dom/Press.js @@ -97,7 +97,7 @@ function isValidKey(e): boolean { const {key, target} = e; const {tagName, isContentEditable} = (target: any); return ( - (key === 'Enter' || key === ' ') && + (key === 'Enter' || key === ' ' || key === 'Spacebar') && (tagName !== 'INPUT' && tagName !== 'TEXTAREA' && isContentEditable !== true) @@ -106,7 +106,10 @@ function isValidKey(e): boolean { function handlePreventDefault(preventDefault: ?boolean, e: any): void { const key = e.key; - if (preventDefault !== false && (key === ' ' || key === 'Enter')) { + if ( + preventDefault !== false && + (key === ' ' || key === 'Enter' || key === 'Spacebar') + ) { e.preventDefault(); } } diff --git a/packages/react-interactions/events/src/dom/PressLegacy.js b/packages/react-interactions/events/src/dom/PressLegacy.js index 3f7e202e8f4ca..8c8db83baf2b3 100644 --- a/packages/react-interactions/events/src/dom/PressLegacy.js +++ b/packages/react-interactions/events/src/dom/PressLegacy.js @@ -570,15 +570,14 @@ const pressResponderImpl = { metaKey, shiftKey, } = (nativeEvent: MouseEvent); - if (nativeEvent.key === ' ') { - nativeEvent.preventDefault(); - } else if ( + if ( props.preventDefault !== false && !shiftKey && !metaKey && !ctrlKey && !altKey ) { + nativeEvent.preventDefault(); state.shouldPreventClick = true; } } else { diff --git a/packages/react-interactions/events/src/dom/__tests__/PressLegacy-test.internal.js b/packages/react-interactions/events/src/dom/__tests__/PressLegacy-test.internal.js index ffd61173f2a3b..77805aceb6aa3 100644 --- a/packages/react-interactions/events/src/dom/__tests__/PressLegacy-test.internal.js +++ b/packages/react-interactions/events/src/dom/__tests__/PressLegacy-test.internal.js @@ -914,8 +914,7 @@ describe.each(environmentTable)('Press responder', hasPointerEvents => { ReactDOM.render(, container); const target = createEventTarget(ref.current); - target.keydown({key: 'Enter'}); - target.click({preventDefault}); + target.keydown({key: 'Enter', preventDefault}); target.keyup({key: 'Enter'}); expect(preventDefault).toBeCalled(); expect(onPress).toHaveBeenCalledWith(