Jack Lynch 3a91cdb875 Settings: Improve display of shortcuts on Mac and non-US keyboards ...

Currently, the shortcut editor mostly just uses the KeyboardEvent.key
field to determine what to display in response to user input. This works
well for en-us keyboard on Windows, but often results in confusing
behavior on keyboards which input special characters with the alt key,
such as Option+c to produce ç on the default Mac US keyboard. In order
to better represent these keypresses, this CL adds KeyboardEvent.code as
a fallback for determining how to display a key in a shortcut.
The W3C details the relationship between physical keys and keycodes at
[1], but it is essentially a string equivalent to the now-deprecated
keyCode field that the DevTools have long used to determine whether
a keypress matches a shortcut. Due to the way Macs handle dead keys, it
is also necessary to set maxlength=0 on the input field to prevent the
OS from appending special characters to it.

Before/after, Ctrl+Option+C on mac: https://imgur.com/a/bizQhMJ


[1] https://www.w3.org/TR/uievents-code/#keyboard-key-codes

Bug: 174309
Change-Id: Ieff84821641d3206ec67b05658f6b23f9d0d36e4
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2643919
Reviewed-by: Benedikt Meurer <bmeurer@chromium.org>
Commit-Queue: Jack Lynch <jalyn@microsoft.com>

2021-02-02 19:21:49 +00:00

..

BUILD.gn

Reland "Settings: Add e2e tests for shortcuts tab"

2020-11-03 19:22:47 +00:00

shortcut_settings_test.ts

Settings: Improve display of shortcuts on Mac and non-US keyboards

2021-02-02 19:21:49 +00:00