Autocomplete keyboard controls assume users are using QWERTY keyboards

Description

Steps to reproduce
Using a keyboard with a layout that does not have the comma key in the same position as this diagram of a QWERTY keyboard

  1. Log in

  2. Post > New Work

  3. In an autocomplete field like Additional Tags, do one of the following:

    1. enter some text and press the comma key on your keyboard

    2. enter some text that uses the key in the same position as the QWERTY keyboard's comma key (e.g. ת on a Hebrew keyboard)

What happens
If you press the comma key on your non-QWERTY keyboard, a comma appears in the field and nothing else happens. You'd expect it to finalize the entry of the tag, making it appear over the field the same way pressing the comma key on a QWERTY keyboard does.

If you press the key that's in the same position as a QWERTY keyboard's comma, it finalizes entry of the tag, making it appear above the field. This effectively prevents you from using whatever letter/character is on that key. You'd expect to be able to use that letter/character normally. (If you're using a QWERTY keyboard, you can also see this behavior by trying to use the < character, which requires you to use the comma key in combination with the Shift key.)

Notes
The autocomplete JavaScript uses the code attribute for all keyboard functionality. We probably need to considering using the key attribute instead, because we care about the character being inputted, not the physical key being pressed. KeyboardEvent.key has good support on new browsers, but it will likely break things for anyone using an unsupported browser.

Environment

None

Status

Assignee

Alix R

Reporter

Sarken

Roadmap

Internationalization
Misc

Priority

High

Affects versions

Fix versions

Components

FrontEnd

Difficulty

Medium

Required Access Level

None

Milestone

Internal 0.9
Configure