Could the webview code use KeyboardEvent.key instead of KeyboardEvent.code?

I attempted to upgrade from Anki 2.0.47 to 24.04beta1 but I was unable to answer any cards with a type-in-answer field like {{type:field}}. This issue occurs because I use a custom keyboard layout that swaps the enter key with the caps lock key, because I find it more ergonomic on European keyboards. While this setup works well with all other programs, the new Anki version failed to recognize my custom caps lock enter. I suspect this is because Anki is using raw keycodes instead of keysyms.

When I examined the code I found the following in ts/reviewer/index.ts:

export function _typeAnsPress(): void {
    const code = (window.event as KeyboardEvent).code;
    if (["Enter", "NumpadEnter"].includes(code)) {

According to Mozilla’s documentation, “The KeyboardEvent.code property represents a physical key on the keyboard (as opposed to the character generated by pressing the key). In other words, this property returns a value that isn’t altered by keyboard layout or the state of the modifier keys.”

Mozilla’s webpage also got an embedded example that can be use to test KeyboardEvents. I tried to add a link to it but the forum will not allow it. Using a Chromium-based browser and my custom keyboard layout I get this test output when I press the caps lock and numpad enter key:

KeyboardEvent: key='Enter' | code='CapsLock'
KeyboardEvent: key='Enter' | code='NumpadEnter'

By changing the KeyboardEvent.code to KeyboardEvent.key in _typeAnsPress(), my custom keyboard layout now works correctly. There are potentially other custom keyboard layouts that are also affected by this issue as there are several other uses of KeyboardEvent.code in the codebase.

I’ve logged this on Could the webview code use KeyboardEvent.key instead of KeyboardEvent.code? · Issue #3069 · ankitects/anki · GitHub

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.