Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[BUG] Sequences like 'g' then '1' kills every other hotkeys after first execution #255

Open
dannystyleart opened this issue Nov 15, 2019 · 8 comments

Comments

@dannystyleart
Copy link

dannystyleart commented Nov 15, 2019

Describe the bug
A clear and concise description of what the bug is.
If we want to create vim like 'g' then '1' hotkeys where the user presses letter g, releases and then presses number 1 are not working.
After first execution of any hotkey mapped, the one letter ones are unbinded

How are you using react hotkeys components? (HotKeys, GlobalHotKeys, IgnoreKeys etc)
I would like to register global hotkeys via GlobalHotKeys component that are having sequences like:

  • 'a' then '1'
  • 'g' then 'l'
    and one letter ones too like 'c' to create message or 'v' to create not and 'b' to tasklist.

Expected behavior
A clear and concise description of what you expected to happen.
Should work for sequences correctly without unbinding others.

Platform (please complete the following information):

  • Version of react-hotkeys: 2.0.0
  • Browser [e.g. chrome, safari]: chrome 78, firefox 71
  • OS: [e.g. iOS]: Linux, MacOs, Winows

Codesandbox for reproduction
https://codesandbox.io/s/react-hotkeys-issue-v6gvy

@dannystyleart
Copy link
Author

Update
I was able to solve this issue, by explicitly import KeyEventManager helper class and call KeyEventManager.getInstance()._clearKeyHistory() in the key handlers.

As it turnt out there is a key always stuck in the listening queue and as a result the previous key sequence's last key will be the "base" for next key events

@rmadsen
Copy link

rmadsen commented Dec 9, 2019

I've been running into this as well. It seems to be the same underlying problem as #219, though I like the solution you have here more. Any details on how to explicitly import KeyEventManager? I wasn't able to find that class exported anywhere in the package.

@dannystyleart
Copy link
Author

dannystyleart commented Dec 12, 2019

@rmadsen yes, there is no public export of KeyEventManager class, so you have to import it either from cjs or es module depending on how your project is configured.

I have imported from the es directory from 'react-hotkeys/es/lib/KeyEventManager' path.
However clearing keyhistory was the only solution for stuck keys like for '?' key on the hungarian-105 we have to press shift and comma.

Later on I have abandoned the idea of using this library - due no respnse at all - and created custom by using hotkeys-js which this library using too.

@greena13
Copy link
Owner

greena13 commented Jan 1, 2020

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.

@v-bbrady
Copy link

@rmadsen @dannystyleart could either of you explicitly tell me how to import KeyEventManager.. I'm getting an error with:
import KeyEventManager from "react-hotkeys/es/lib/KeyEventManager"

error:

Could not find a declaration file for module 'react-hotkeys/es/lib/KeyEventManager'. 'c:/Users/v-bbrady/projects/AzureNotebooks/AzureNotebooks/src/client/aznb-component/node_modules/react-hotkeys/es/lib/KeyEventManager.js' implicitly has an 'any' type.
  Try `npm install @types/react-hotkeys` if it exists or add a new declaration (.d.ts) file containing `declare module 'react-hotkeys/es/lib/KeyEventManager'

@dannystyleart
Copy link
Author

@v-bbrady this is because you are using typescript.

I was using this package in an ES project so I did not face this problem but I think the solution for your problem would be:

  • define the type explicitly
  • turn off type checking for that import / line.

@greena13 I have moved away from that feature but as soon as I have time for it I'll try to make a fix and PR for it.

@Harjot1Singh
Copy link
Contributor

@dannystyleart your solution works, but unfortunately, if you keep holding down a modifier key from the previous hotkey, and then press another key for another hotkey that has the same modifier, the modifier key gets erased from the listening queue.

Given
ctrl+d => action 1
ctrl+y => action 2

Case 1:
Hold ctrl
Press d
=> Action 1 fires
Press y
=> Action 2 does not fire

Case 2:
Hold ctrl
Press d
=> Action 1 fires
Release ctrl
Hold ctrl
Press y
=> Action 2 fires

Looks like getting around this requires a more robust fix in the codebase itself.

@JoeDuncko
Copy link

FYI I was getting errors from Jest with this fix unless I imported KeyEventManager like so:

import KeyEventManager from "react-hotkeys/cjs/lib/KeyEventManager"

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

6 participants