I use an alternative keyboard layout. When I hit "shift-option-D" to open the devtools, then nothing happens.
The problem is in using KeyboardEvent.code vs .key. When I hit my D, then the event contains {code: "d", key: "KeyW"!
The code in https://github.com/nuxt/devtools/blob/main/packages/devtools/src/runtime/plugins/view/client.ts#L274 uses KeyboardEvent.code which refers to the physical key being pressed. Alternatively, the code could use KeyboardEvent.key, which is d when I press D in my layout. Unfortunately in combination with Shift and Option the event becomes {altKey: true, code: "KeyW", key: "ร", shiftKey: true}!
I see (in Chrome) the KeyboardEvent attribute keyCode which does not change with and without modifier keys pressed, it is 68. So the code could use this property and it would work regardless of keyboard layout. The KeyboardEvent.keyCode attribute is deprecated however. ๐ข I also see an undocumented (?) KeyboardEvent.which which is also 68.
I thought I'd send a PR, but I genuinely don't know what the correct solution would be here!
๐ ๏ธ To reproduce
select alternate keyboard layout like colemak or workman, I'm on a mac in case that's relevant
๐ Expected behavior
Shift-Option-D should open devtools, regardless of the user's current keyboard layout.
๐ The bug
I use an alternative keyboard layout. When I hit "shift-option-D" to open the devtools, then nothing happens.
The problem is in using
KeyboardEvent.code
vs.key
. When I hit my D, then the event contains{code: "d", key: "KeyW"
!The code in https://github.com/nuxt/devtools/blob/main/packages/devtools/src/runtime/plugins/view/client.ts#L274 uses
KeyboardEvent.code
which refers to the physical key being pressed. Alternatively, the code could useKeyboardEvent.key
, which isd
when I press D in my layout. Unfortunately in combination with Shift and Option the event becomes{altKey: true, code: "KeyW", key: "ร", shiftKey: true}
!I see (in Chrome) the KeyboardEvent attribute
keyCode
which does not change with and without modifier keys pressed, it is68
. So the code could use this property and it would work regardless of keyboard layout. TheKeyboardEvent.keyCode
attribute is deprecated however. ๐ข I also see an undocumented (?)KeyboardEvent.which
which is also68
.I thought I'd send a PR, but I genuinely don't know what the correct solution would be here!
๐ ๏ธ To reproduce
๐ Expected behavior
Shift-Option-D should open devtools, regardless of the user's current keyboard layout.
โน๏ธ Additional context
No response