Detect slash key by value, not physical position #415

Merged

Gusted merged 1 commit from AndrewKvalheim/Codeberg-Documentation:KeyboardEvent.key into main

2024-04-03 14:12:55 +02:00

AndrewKvalheim commented

2024-04-02 19:37:55 +02:00

Contributor

When I try to type the letter y into the search field, nothing appears to happen:

Helpfully, the “Press / to focus” is an immediate clue. On my keyboard the Y key is physically at the bottom right position, where you would find / on a QWERTY layout. It turns out that the page is eating my Y key press because it assumes a QWERTY layout and attempts to detect a slash by the key’s physical position rather than its actual meaning. I can focus the search field by pressing Y.

The solution is trivial; read the property for actual meaning instead of physical position.

When I try to type the letter `y` into the search field, nothing appears to happen: > <img src="/?originalUrl=https%3A%2F%2Fcodeberg.org%2F%26%2334%3B%2Fattachments%2Fdfd40588-3f9f-4044-90e8-b23e6f808b87%26%2334%3B%2520width%3D%26%2334%3B257%26%2334%3B%2520alt%3D%26%2334%3Bscreenshot%26%2334%3B%2520%2F%26gt%3BHelpfully%2C%2520the%2520%25E2%2580%259CPress%2520%26lt%3Bkbd%26gt%3B%2F%26lt%3B%2Fkbd%26gt%3B%2520to%2520focus%25E2%2580%259D%2520is%2520an%2520immediate%2520clue.%2520On%2520my%2520keyboard%2520the%2520%26lt%3Bkbd%26gt%3BY%26lt%3B%2Fkbd%26gt%3B%2520key%2520is%2520physically%2520at%2520the%2520bottom%2520right%2520position%2C%2520where%2520you%2520would%2520find%2520%26lt%3Bkbd%26gt%3B%2F%26lt%3B%2Fkbd%26gt%3B%2520on%2520a%2520QWERTY%2520layout.%2520It%2520turns%2520out%2520that%2520the%2520page%2520is%2520eating%2520my%2520%26lt%3Bkbd%26gt%3BY%26lt%3B%2Fkbd%26gt%3B%2520key%2520press%2520because%2520it%2520assumes%2520a%2520QWERTY%2520layout%2520and%2520attempts%2520to%2520detect%2520a%2520slash%2520by%2520the%2520key%25E2%2580%2599s%2520*physical%2520position*%2520rather%2520than%2520its%2520actual%2520meaning.%2520I%2520can%2520focus%2520the%2520search%2520field%2520by%2520pressing%2520%26lt%3Bkbd%26gt%3BY%26lt%3B%2Fkbd%26gt%3B.The%2520solution%2520is%2520trivial%3B%2520read%2520the%2520%5Bproperty%5D(https%3A%2F%2Fdeveloper.mozilla.org%2Fen-US%2Fdocs%2FWeb%2FAPI%2FKeyboardEvent%23instance_properties)%2520for%2520actual%2520meaning%2520instead%2520of%2520physical%2520position.%253C%2Fdiv">

Screenshot from 2024-04-02 10-14-29.qnt.png

2.5 KiB

AndrewKvalheim added 1 commit

2024-04-02 19:37:56 +02:00

Detect slash key by value, not physical position 5080db448a

The KeyboardEvent’s `code` property encodes the physical position of a
key by naming what key would hypothetically be at that position on a
QWERTY layout. For users with non-QWERTY layouts, this name does not
necessarily correspond with the actual behavior of the key.