Re: [w3c/uievents] Proposal: Way to determine if any modifier key is pressed (#151)

I would love to see this addressed in the platform.

Currently, many libraries like CodeMirror must rely on platform detection.
https://github.com/codemirror/codemirror5/blob/5.65.9/src/edit/key_events.js#L120


In my own experience, I have noticed smaller libraries appear often unaware of this interop issue and either listen to one modifier or the other. When the issue is brought to their attention by users of apple or non-apple devices, authors quickly patch the issue by listening to both meta and control keys simultaneously. This unfortunately locks users into there only ever being two possible answers on two possible platforms (apple and non-apple).

[MDN docs](https://developer.mozilla.org/en-US/docs/Web/API/Navigator/platform#examples) mention `navigation.platform` as the “least-bad” option “when you need to show users advice about whether the modifier key for keyboard shortcuts is the ⌘ command key (found on Apple systems) rather than the ⌃ control key (on non-Apple systems).”

The accepted [StackOverflow answer](https://stackoverflow.com/questions/29033081/setting-os-specific-keybindings-cmd-on-mac-and-ctrl-on-everything-else/29035153#29035153) on this subject begins “_Unfortunately at this time there is no JavaScript API for detecting if the host OS uses the Ctrl key or the Cmd key for keyboard shortcuts._”

I would suggest adding a new boolean key to `KeyboardEvent`; `modifierKey`. It would, effectively, map to the following speculative polyfill:

```js
const isApplePlatform = navigator.platform === 'MacIntel' || navigator.platform === 'iPhone'
const modifierKey = isApplePlatform ? 'metaKey' : 'ctrlKey'
const modifierKeyDescriptor = Object.getOwnPropertyDescriptor(KeyboardEvent.prototype, modifierKey)

Object.defineProperty(KeyboardEvent.prototype, 'modifierKey', modifierKeyDescriptor)
```

-- 
Reply to this email directly or view it on GitHub:
https://github.com/w3c/uievents/issues/151#issuecomment-1305673156

You are receiving this because you are subscribed to this thread.

Message ID: <w3c/uievents/issues/151/1305673156@github.com>