Incorrect keyname when using Portuguese keyboard in Safari #14

Closed
opened 2022-08-01 11:32:55 +02:00 by 40thieves · 4 comments
40thieves commented 2022-08-01 11:32:55 +02:00 (Migrated from github.com)

There appears to be a bug in the keyname calculation when using a Portuguese keyboard layout in Safari. I'm also aware that Swedish keyboard layouts are affected (and possibly others), but haven't tested as extensively.

Specifically, pressing Shift-7 returns ? when it should return /. I've put together this minimal reproduction to demonstrate the issue. Here's some screenshots from a colleague with a Portuguese keyboard:

Safari

safari

Chrome

chrome

Firefox

firefox

I can also reproduce by switching my keyboard input source to Portuguese on macOS.

For context, we have added a Meta-Shift-7 keybinding in CodeMirror 6, to account for the default toggle comment shortcut (Meta-/) not working on Portuguese keyboards across all browsers. I believe this is because / is on Shift-7 on Portuguese (and similar) keyboard layouts.

There appears to be a bug in the keyname calculation when using a Portuguese keyboard layout in Safari. I'm also aware that Swedish keyboard layouts are affected (and possibly others), but haven't tested as extensively. Specifically, pressing `Shift-7` returns `?` when it should return `/`. I've put together this [minimal reproduction](https://6tx1wk.csb.app/) to demonstrate the issue. Here's some screenshots from a colleague with a Portuguese keyboard: **Safari** <img width="791" alt="safari" src="https://user-images.githubusercontent.com/424411/182118115-4676df0b-22d5-4897-b39f-4929cc10b936.png"> **Chrome** <img width="898" alt="chrome" src="https://user-images.githubusercontent.com/424411/182117882-072ffe63-fdbc-4651-a498-0a139c80591d.png"> **Firefox** <img width="957" alt="firefox" src="https://user-images.githubusercontent.com/424411/182118073-50bcd9c6-e8d5-4a27-8636-ec2a643f1fe4.png"> I can also reproduce by switching my keyboard input source to Portuguese on macOS. For context, we have added a `Meta-Shift-7` keybinding in CodeMirror 6, to account for the default toggle comment shortcut (`Meta-/`) not working on Portuguese keyboards across all browsers. I believe this is because `/` is on `Shift-7` on Portuguese (and similar) keyboard layouts.
marijnh commented 2022-08-01 16:00:58 +02:00 (Migrated from github.com)

What are the values of event.key and event.keyCode when this happens?

What are the values of `event.key` and `event.keyCode` when this happens?
40thieves commented 2022-08-01 16:56:20 +02:00 (Migrated from github.com)

Here's the "event dump" from keycode.info when using Safari:

{
 "key": "/",
 "keyCode": 191,
 "which": 191,
 "code": "Digit7",
 "location": 0,
 "altKey": false,
 "ctrlKey": false,
 "metaKey": false,
 "shiftKey": true,
 "repeat": false
}

And here's the same when using Chrome & Firefox for reference:

{
 "key": "/",
 "keyCode": 55,
 "which": 55,
 "code": "Digit7",
 "location": 0,
 "altKey": false,
 "ctrlKey": false,
 "metaKey": false,
 "shiftKey": true,
 "repeat": false
}
Here's the "event dump" from [keycode.info](http://keycode.info/) when using Safari: ``` { "key": "/", "keyCode": 191, "which": 191, "code": "Digit7", "location": 0, "altKey": false, "ctrlKey": false, "metaKey": false, "shiftKey": true, "repeat": false } ``` And here's the same when using Chrome & Firefox for reference: ``` { "key": "/", "keyCode": 55, "which": 55, "code": "Digit7", "location": 0, "altKey": false, "ctrlKey": false, "metaKey": false, "shiftKey": true, "repeat": false } ```
marijnh commented 2022-08-04 12:01:50 +02:00 (Migrated from github.com)

Looks like the logic to correct for inaccurate key properties was kicking in too aggressively here. Patch github.com/marijnh/w3c-keyname@600aae45ec should help.

Looks like the logic to correct for inaccurate `key` properties was kicking in too aggressively here. Patch https://github.com/marijnh/w3c-keyname/commit/600aae45ece2d2e6486279c34e631695621403e2 should help.
40thieves commented 2022-08-04 16:02:05 +02:00 (Migrated from github.com)

Thanks! Looks like that's fixed now:

Comparison of output for Chrome, Firefox and Safari. All show / as the correct output

I'll close this out now.

Thanks! Looks like that's fixed now: ![Comparison of output for Chrome, Firefox and Safari. All show / as the correct output](https://user-images.githubusercontent.com/424411/182866070-87fbd04c-188b-4f1d-9ae0-e7de32fde724.png) I'll close this out now.
Sign in to join this conversation.
No labels
No milestone
No project
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference
marijn/w3c-keyname#14
No description provided.