3

When using GBoard keyboard (at least), it appears that onKeyDown and onKeyUp are not firing when pressing the Tab button (the one at the bottom-right corner, with an arrow).

This is causing an issue on a React app we have, where this button is behaving exactly like pressing the Tab button on a real keyboard, but we're able to suppress its behavior on desktops and other devices.

I've confirmed that this is not a React issue, as if I try exactly the same with the below, the event isn't fired when pressing Tab on Android/GBoard:

<input id="text-field" type="text" placeholder="Press Tab here" />
<input id="text-field-2" type="text" />
<script>
$('#text-field').on('keydown', function (e) {
    alert(e.key);
});
</script>

Tested on Android 10 & Android 11, using Google Chrome with GBoard.

Any idea how to handle the pressing of that button?
Is this intended/documented?

enter image description here

enter image description here

Nuno
  • 3,082
  • 5
  • 38
  • 58
  • Does [this](https://stackoverflow.com/questions/43503964/onkeydown-event-not-working-on-divs-in-react) or [this](https://stackoverflow.com/questions/59546928/keydown-up-events-with-react-hooks-not-working-properly) or [this](https://stackoverflow.com/questions/47478453/keyup-keydown-and-keypress-events-not-working-on-mobile) help? Probably [the issue still persists](https://github.com/react-tags/react-tags/issues/199). – The Amateur Coder Jan 27 '22 at 13:25
  • 2
    Thanks for the answer. But please note, the events DO fire for all other keys. Just not for this "Tab" key. Those issues you linked appear to be more that "doesn't fire for any key". Cheers. – Nuno Jan 27 '22 at 13:28

0 Answers0