Handy helper tool by Wes Bos: simply press any key and see the results for
As a user with an
AZERTY keyboard layout I often have a broken experience on sites that respond to first row of keys, e.g.
QWERTY. As those sites respond to
KeyboardEvent.key — which differs from layout to layout — I cannot simply use the first row, but have to reach for the
W keys on the second and third row.
To properly implement key presses independent of the keyboard layout, it’s recommended to use
e.keyCode as that will yield the same
keyCode. As per MDN:
KeyboardEvent.codeproperty represents a physical key on the keyboard (as opposed to the character generated by pressing the key). In other words, this property returns a value that isn’t altered by keyboard layout or the state of the modifier keys.
For example: pressing
AZERTY will yield
QWERTY will also yield
KeyQ as they’re the same physical key.