While working on
electrum and its bus, I needed to handle keyboard
events and send them back from the browser (more specifically, from
Electron) to the presentation layer written in C#.
Electrum components fire React synthetic events
and on every key down event, the bus gets the opportunity to send
some information to the presentation layer over SignalR, based on
data found in said
I decided to categorize the keyboard events:
- Vertical navigation (up/down arrows, page up/down).
- Line navigation (left/right arrows, home/end).
- Selection (enter/escape).
- Function keys (F1…F12).
SyntheticEvent also exposes properties of the underlying DOM
event, which give an indication of the state of the various modifier
keys, such as Alt, Ctrl, etc.
I wanted to know if I could also easily find out if Caps Lock is turned on, so that we could do some smart feed-back while typing text into a password field.
Looking for solutions on the web pointed to lots of outdated solutions which required some smart event listening, checking if the character produced would be upper case while no shift is pressed, or lower case while shift is pressed.
Digging into MDN’s documentation
KeyboardEvent, I stumbled on
does exactly what I need:
const hasAlt = ev.getModifierState ('Alt'); const hasScrollLock = ev.getModifierState ('ScrollLock'); // ...
Alas, trying this out in Electrum shell does never return
The feature seems to have been implemented recently on chromium (marked as fixed on February 23 2016), so there is hope that it will also find its way into my Electron instance in the near future.
EDIT in Electron 1.0.2
getModifierState() works just fine.
Thank you Mathieu Schroeter for updating our code base! However,
the Chromium engine does not distinguish between Ctrl+Alt and