Dispatch keypresses not working.

[nullydev]

I'm working on an overlay app. To keep the window on top and not close any Fullscreen game I had to put 'focus' to False and 'on_top' to True. The downside to this is that even tho I can press and scroll and interact with my app, keyboard messages are not being received on the window (as expected since there is no focus). This is the current solution I cam up with.

I made a javascript function to check for focus on input fields when someone clicks on it that then calls starts a listener using the keyboard lib. Which then allows me to send down/up and keycodes to javascript.

    @eel.expose
    def fieldfocus():
        keyboard.hook(print_key_event)
        
    @eel.expose
    def fieldnotfocus():
        keyboard.unhook(print_key_event)
        
    def print_key_event(event):
        print(f'Key {event.name} {event.event_type}')
    
        if event.event_type == 'down':
            if keyboard.is_pressed('ctrl+a') or keyboard.is_pressed('right ctrl+a'):
                eel.key('ctrl+a')
            else:
                eel.key(event.name)

Wat I currently have on the JS side. This way I have to manually replicate and recreate all keyboard shortcuts and functionalities from scratch which is pretty annoying.

        eel.expose(key);

        function handleFocus() {
            eel.fieldfocus();
        }

        function handleBlur() {
            eel.fieldnotfocus();
        }
        function key(key) {
            const inputField = document.activeElement;
            switch (key) {
                case 'ctrl':
                case 'right ctrl':
                case 'shift':
                case 'right shift':
                case 'insert':
                case 'page up':
                case 'page down':
                    return;
                    break;
                default:
                    inputField.value += key;
                    break;
            }
            document.querySelectorAll('input[type="text"]').forEach(field => {
                    field.addEventListener("focus", handleFocus);
                    field.addEventListener("blur", handleBlur);
            });
        }

What I wished I could do but cannot seem to get to work is KeyboardEvents. This way I could replicate keypresses on the focused fields.

    // Simulate keydown event
    const keydownEvent = new KeyboardEvent('keydown', { key: 'e' });
    document.activeElement.dispatchEvent(keydownEvent);

    // Simulate keyup event
    const keyupEvent = new KeyboardEvent('keyup', { key: 'e' });
    document.activeElement.dispatchEvent(keyupEvent);