search

greena13 / react-hotkeys

Declarative hotkey and focus area management for React
https://github.com/greena13/react-hotkeys
ISC License
2.15k stars 160 forks source link

[BUG]: GlobalHotKeys firing before HotKeys component #254

Open markmcdowell opened 4 years ago

markmcdowell commented 4 years ago

Hi there! this library is really cool, exactly what I was looking for & thanks for the hard work!

I'm raising this issue as a bug but could be more of a question of how the library is working and something else is causing a side effect.

Describe the bug When a GlobalHotKeys component is added it always receives the key events first, this means the focused HotKeys component ignores the keyup event and doesn't fire.

I've added a keydown event and a keyup event for the shift key, the keydown fires ok but the keyup never does. If I remove GlobalHotKeys it works.

How are you using react hotkeys components? (HotKeys, GlobalHotKeys, IgnoreKeys etc)

GlobalHotKeys and HotKeys

Expected behavior The focused HotKeys would respond to the events first.

Platform (please complete the following information):

Are you willing and able to create a PR request to fix this issue? Yes if I can get an idea of what is going on.

Include the smallest log that includes your issue:

HotKeys (GLOBAL-C0🔺): Bound handler handleGlobalKeyDown() to document.onkeydown()
GlobalKeyEventStrategy.js:210 HotKeys (GLOBAL-C0🔺): Bound handler handleGlobalKeyPress() to document.onkeypress()
GlobalKeyEventStrategy.js:210 HotKeys (GLOBAL-C0🔺): Bound handler handleGlobalKeyUp() to document.onkeyup()
GlobalKeyEventStrategy.js:120 HotKeys (GLOBAL-C0🔺): Mounted.
GlobalKeyEventStrategy.js:161 HotKeys (GLOBAL-C0🔺): Global component 0 updated.
FocusOnlyKeyEventStrategy.js:153 HotKeys (F0📕-C0🔺-P0🔺:) Focused. 
GlobalKeyEventStrategy.js:310 HotKeys (GLOBAL-E1💚): New 'Shift' keydown event (that has NOT passed through React app).
GlobalKeyEventStrategy.js:547 HotKeys (GLOBAL-E1💚): Ignored 'Shift' keydown because it doesn't have any keydown handlers.
GlobalKeyEventStrategy.js:310 HotKeys (GLOBAL-E2💙): New (simulated) 'Shift' keypress event (that has NOT passed through React app).
AbstractKeyEventStrategy.js:429 HotKeys (GLOBAL-E2💙-C0🔺): No matching actions found for 'Shift' keypress.
FocusOnlyKeyEventStrategy.js:298 HotKeys (F0📕-E3💛-C0🔺-P0🔺:) New 'Shift' keydown event.
AbstractKeyEventStrategy.js:418 HotKeys (F0📕-E3💛-C0🔺-P0🔺:) Found action that matches 'Shift': ENTER_PASSIVE_MODE. Calling handler . . .
FocusOnlyKeyEventStrategy.js:508 HotKeys (F0📕-E3💛-C0🔺-P0🔺:) Stopping further event propagation.
GlobalKeyEventStrategy.js:310 HotKeys (GLOBAL-E4💜): New 'Shift' keyup event (that has NOT passed through React app).
GlobalKeyEventStrategy.js:547 HotKeys (GLOBAL-E4💜): Ignored 'Shift' keyup because it doesn't have any keyup handlers.
FocusOnlyKeyEventStrategy.js:400 HotKeys (F0📕-E4💜-C0🔺-P0🔺:) Ignored 'Shift' keyup as it was not expected, and has already been simulated.
EventPropagator.js:252 HotKeys (F0📕-E4💜-Cnull🔺) Stopping further event propagation.
FocusOnlyKeyEventStrategy.js:220 HotKeys (F0📕-C0🔺-P0🔺:) Lost focus.

What Configuration options are you using?

configure({
    ignoreTags: [],
    logLevel: "debug",
})
greena13 commented 4 years ago

Thanks for posting your issue.

Unfortunately I do not have the time to actively work on this package, but I am seeking other active maintainers. If you are willing to create a pull request or help out, that would be an excellent way of moving this forward.