diff options
4 files changed, 18 insertions, 17 deletions
diff --git a/server/sonar-web/src/main/js/app/components/KeyboardShortcutsModal.tsx b/server/sonar-web/src/main/js/app/components/KeyboardShortcutsModal.tsx index 1a92d7b6551..03b486af054 100644 --- a/server/sonar-web/src/main/js/app/components/KeyboardShortcutsModal.tsx +++ b/server/sonar-web/src/main/js/app/components/KeyboardShortcutsModal.tsx @@ -20,6 +20,8 @@ import * as React from 'react'; import { Button } from '../../components/controls/buttons'; import Modal from '../../components/controls/Modal'; +import { isInput } from '../../helpers/keyboardEventHelpers'; +import { KeyboardKeys } from '../../helpers/keycodes'; import { translate } from '../../helpers/l10n'; type Shortcuts = Array<{ @@ -129,22 +131,20 @@ export default function KeyboardShortcutsModal() { const [display, setDisplay] = React.useState(false); React.useEffect(() => { - const handleKeyPress = (event: KeyboardEvent) => { - const { tagName } = event.target as HTMLElement; - - if (['INPUT', 'SELECT', 'TEXTAREA'].includes(tagName)) { - return; // Ignore keys when typed in an input + const handleKeyDown = (event: KeyboardEvent) => { + if (isInput(event)) { + return true; } - if (event.key === '?') { + if (event.key === KeyboardKeys.KeyQuestionMark) { setDisplay(d => !d); } }; - window.addEventListener('keypress', handleKeyPress); + document.addEventListener('keydown', handleKeyDown); return () => { - window.removeEventListener('keypress', handleKeyPress); + document.removeEventListener('keydown', handleKeyDown); }; }, [setDisplay]); diff --git a/server/sonar-web/src/main/js/app/components/__tests__/KeyboardShortcutsModal-test.tsx b/server/sonar-web/src/main/js/app/components/__tests__/KeyboardShortcutsModal-test.tsx index 5c3967754d8..4727c3deb92 100644 --- a/server/sonar-web/src/main/js/app/components/__tests__/KeyboardShortcutsModal-test.tsx +++ b/server/sonar-web/src/main/js/app/components/__tests__/KeyboardShortcutsModal-test.tsx @@ -46,36 +46,36 @@ it('should render correctly', () => { const wrapper = shallowRender(); expect(wrapper).toMatchSnapshot('hidden'); - window.dispatchEvent(new KeyboardEvent('keypress', { key: '?' })); + document.dispatchEvent(new KeyboardEvent('keydown', { key: '?' })); expect(wrapper).toMatchSnapshot('visible'); }); it('should close correctly', () => { const wrapper = shallowRender(); - window.dispatchEvent(new KeyboardEvent('keypress', { key: '?' })); + document.dispatchEvent(new KeyboardEvent('keydown', { key: '?' })); wrapper.find(Modal).props().onRequestClose!(mockEvent()); expect(wrapper.type()).toBeNull(); }); -it('should ignore other keypresses', () => { +it('should ignore other keydownes', () => { const wrapper = shallowRender(); - window.dispatchEvent(new KeyboardEvent('keypress', { key: '!' })); + document.dispatchEvent(new KeyboardEvent('keydown', { key: '!' })); expect(wrapper.type()).toBeNull(); }); it.each([['input'], ['select'], ['textarea']])('should ignore events on a %s', type => { const wrapper = shallowRender(); - const fakeEvent = new KeyboardEvent('keypress', { key: '!' }); + const fakeEvent = new KeyboardEvent('keydown', { key: '!' }); Object.defineProperty(fakeEvent, 'target', { value: document.createElement(type) }); - window.dispatchEvent(fakeEvent); + document.dispatchEvent(fakeEvent); expect(wrapper.type()).toBeNull(); }); diff --git a/server/sonar-web/src/main/js/apps/security-hotspots/components/HotspotViewerTabs.tsx b/server/sonar-web/src/main/js/apps/security-hotspots/components/HotspotViewerTabs.tsx index 996ea790cd4..100a42eb9de 100644 --- a/server/sonar-web/src/main/js/apps/security-hotspots/components/HotspotViewerTabs.tsx +++ b/server/sonar-web/src/main/js/apps/security-hotspots/components/HotspotViewerTabs.tsx @@ -100,11 +100,11 @@ export default class HotspotViewerTabs extends React.PureComponent<Props, State> }; registerKeyboardEvents() { - window.addEventListener('keydown', this.handleKeyboardNavigation); + document.addEventListener('keydown', this.handleKeyboardNavigation); } unregisterKeyboardEvents() { - window.removeEventListener('keydown', this.handleKeyboardNavigation); + document.removeEventListener('keydown', this.handleKeyboardNavigation); } handleSelectTabs = (tabKey: TabKeys) => { diff --git a/server/sonar-web/src/main/js/helpers/keycodes.ts b/server/sonar-web/src/main/js/helpers/keycodes.ts index c222a202457..f061e98713c 100644 --- a/server/sonar-web/src/main/js/helpers/keycodes.ts +++ b/server/sonar-web/src/main/js/helpers/keycodes.ts @@ -51,5 +51,6 @@ export enum KeyboardKeys { KeyI = 'i', KeyC = 'c', KeyT = 't', - KeyS = 's' + KeyS = 's', + KeyQuestionMark = '?' } |