Keybindings not working when input is focused inside iframe

[pbshgthm]

Let's say a react component <Foo/> is rendered inside an iframe using react-frame-component. Now <Foo/> has a tinykeys hook registered. Everything works as expected. <Foo/> also has an input element. When the input element comes into focus, tinykeys doesn't work anymore. Even if the input gets out of focus, tinykeys doesn't work. As long as no input/contentEditable div is ever in focus, no issues. If it gets in focus even once, tinykeys stops working, until a page refresh. Where should I look at?

Since it's a little weird setup (I'm working on an extension using React), I'm not adding an issue-reproducible repo code. Based on what exactly would be useful for troubleshooting, I can create an issue-reproducible code snippet.

Thanks in advance!

[jamiebuilds]

If your focus is still in an iframe (which is may be still even as your focus leaves the input), then the parent window is not going to receive keypress events and tinykeys isn't going to know that anything is happening.

You may want to try using createKeybindingsHandler and then binding it to multiple windows:

let handler = createKeybindingsHandler({ ... })

window.addEventListener("keydown", handler)
iframeWindow.addEventListener("keydown", handler)

[pbshgthm]

Actually, I don't need the keypress events to the parent window, just need it inside the iframe. tinykey handler is inside the component that gets rendered inside the iframe. As long as i don't focus on an input, it works, only after an input element gets in focus it stops working. I tried assigning the event handlers via createKeybindingsHandler and yet it doesn't seem to work :(

[Reflex-Gravity]

@jamiebuilds This is because of the instance check. It seems that when event is triggered inside an iframe, the event doesn't match the KeyboardEvent instance. Thus, it doesn't proceed forward.

if (!(event instanceof KeyboardEvent)) {
     return
}

Maybe based on a configuration we can skip this check or check the event.type.

Let me know, I can raise a PR for this.