Keyboard shortcuts do not work on <input type="number"/> elements

[MadQ]

Keyboard shortcuts like Ctrl+C, Ctrl+V, Ctrl+A, etc. in <input type="number"/> elements do not work (i.e. text is not copied or pasted, "all text" is not selected). The corresponding items in the context menu do work as expected.

To reproduce, go to any tab in Configurator that has <input type="number"/> elements. Try to use the keyboard shortcuts as shown in the context menu.

This issue occurs in Windows. I dot know if it is the same in other OSs. @mikeller suggested that it might be due to switching from using Chrome Windows to NW.js Windows. If someone could volunteer to try and duplicate it on Linux, Mac, or Android, it would be much appreciated

[issue-label-bot[bot]]

Issue-Label Bot is automatically applying the label bug to this issue, with a confidence of 0.89. Please mark this comment with :thumbsup: or :thumbsdown: to give our bot feedback!

Links: app homepage, dashboard and code for this bot.

[McGiverGim]

Not exactly... it seems we intercept all the key presses and only let continue a 'whitelist'...

https://github.com/betaflight/betaflight-configurator/blob/a52efd7ec818b650295dc5b6e1c05b936e2053f5/src/js/main.js#L478-L491

I'm not sure what was the reason of doing this, but this code is here since at least 6 years ago...

[MadQ]

Not exactly... it seems we intercept all the key presses and only let continue a 'whitelist'...

I'm not sure what was the reason of doing this, but this code is here since at least 6 years ago...

Since .keyCode has been deprecated in favor of .code, it might be a good idea to change it. Unless someone knows if there is a specific reason for that event handler to exist, it would be even better to just remove it entirely. If I have some time this weekend, I will dig into it and create a PR if it doesn't break anything obvious. I can't possibly test every single number input in configurator myself, but we can always revert it, if necessary.

[McGiverGim]

If you can create a better version this weekend it will very appreciated. I will be out so I can't do it by myself.

[haslinghuis]

Same behavior on Ubuntu 20.04, Keyboard shortcut's don't work but the corresponding items in the context menu do - not surprising with the whitelist in place.

[mikeller]

Lol, good find @McGiverGim - I'd never come across this. :grinning:

This seems to be something that is most likely not needed any more in the current runtime environments, it should probably be removed altogether.

[McGiverGim]

@MadQ your PR was closed, it seems on your side. Can you confirm if this was intended?

[haslinghuis]

Hmm, this seems just to make sure only numbers can be typed in and some allowed control codes. But I don't see the value of using shortcuts in these fields? Anyway we could simple allow the shortcuts in the menu by adding them.

Did some mockup and it's weird as values copy pasted are not saved correctly (substract 1 from the original value?) and the use of allowed seems inverse:

    $("#content").on('keydown', 'input[type="number"]', function (e) {
        // whitelist all that we need for numeric control
        const whitelist = [
            96, 97, 98, 99, 100, 101, 102, 103, 104, 105, 48, 49, 50, 51, 52, 53, 54, 55, 56, 57, // numpad and standard number keypad
            109, 189, // minus on numpad and in standard keyboard
            8, 46, 9, // backspace, delete, tab
            190, 110, // decimal point
            37, 38, 39, 40, 13, // arrows and enter
        ];

        const allowed =
            (e.code === 90 && e.ctrlKey) || // control Z
            (e.code === 90 && e.ctrlKey && e.shiftKey) || // control shift Z
            (e.code === 88 && e.ctrlKey) || // control X
            (e.code === 67 && e.ctrlKey) || // control C
            (e.code === 86 && e.ctrlKey) || // control V
            (e.code === 86 && e.ctrlKey && e.shiftKey) || // control shift V
            (e.code === 65 && e.ctrlKey); // control A

        if (whitelist.indexOf(e.code) === -1 && allowed) {
            console.log(e.code, e.ctrlKey, e.shiftKey);
            e.preventDefault();
        }
    });

EDIT: should need OSX key combinations too. EDIT2: it's substracting 1 on copy / paste / save on notch filters - so strange behavior occur enabling these control combinations