Keybinding API not firing key up when element focused

[aaclayton]

Originally in GitLab by @arcanistzed

Environment Details

• Foundry VTT Version: 9.238
• Operating System: Linux Mint
• How Are You Using Foundry: Chrome
• Which Game System: dnd5e
• Modules Enabled?: not relevant

Issue Description

Pressing down a keybinding's key and then clicking on an element causes events to no longer be fired until the element is unfocused. This is breaking for flows where keys are meant to be held while clicking buttons.

Reproduction steps

• Type this in chat <button>Test</button>
• Register a keybinding
• Hold down the key and see that an onDown is fired
• While holding the key, click the button in chat
• See that no events are fired anymore when pressing the key
• Click on a blank spot in the sidebar and see that events are fired once more

Alternative reproduction steps

• Create a <details> element with a <summary> and a <button> inside
• Register a keybind with Shift
• Hold down Shift, click on the button created earlier, and then lift up Shift
• Notice that the onDown callback is fired, but not the onUp callback (this is likely to the focus switching to the <summary> element for some reason)

[aaclayton]

We captured this here: https://gitlab.com/foundrynet/foundryvtt/-/issues/6391, but since this was a transcription of your original report I will close that one and leave this one as the ongoing report.

[aaclayton]

I suspect our issue here is that the <details> element can have :focus which causes us to ignore keybinding events despite the <details> element not really being an editable input field. We may need to refine our logic for "does an editable input have focus" to use a more precise set of selectors.

[aaclayton]

Originally in GitLab by @arcanistzed

I didn't check for another issue, my bad. I decided to make this issue because I found this happening with the much more common use case of button clicks.

[aaclayton]

Originally in GitLab by @arcanistzed

You were right. I temporarily fixed this by libWrapping KeyboardManager#hasFocus and replacing it with this:

get hasFocus() {
    return document.querySelectorAll("input:focus, textarea:focus").length > 0;
}