question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Keyboard focus (from a physical keyboard) won't enter TextInput fields on Tab/Shift+Tab in Android

See original GitHub issue

Description

On Android devices, when other focusable controls (such as Buttons) are adjacent to a TextInput component, and a physical keyboard is used to interact with the app (e.g. via bluetooth or USB connection), keyboard focus will stop at the focusable element before the TextInput when tabbing or at the one after the TextInput when shift-tabbing.

React Native version:

System:
    OS: Windows 10 10.0.18363
    CPU: (8) x64 Intel(R) Core(TM) i7-6700K CPU @ 4.00GHz
    Memory: 13.44 GB / 31.94 GB
  Binaries:
    Node: 12.16.1 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.19.1 - C:\Program Files (x86)\Yarn\bin\yarn.CMD
    npm: 6.14.4 - C:\Program Files\nodejs\npm.CMD
    Watchman: Not Found
  SDKs:
    Android SDK: Not Found
    Windows SDK:
      AllowAllTrustedApps: Enabled
  IDEs:
    Android Studio: Version  4.0.0.0 AI-193.6911.18.40.6626763
    Visual Studio: 15.9.28307.518 (Visual Studio Enterprise 2017)
  Languages:
    Java: Not Found
    Python: 2.7.11 - C:\Python27\python.EXE
  npmPackages:
    @react-native-community/cli: Not Found
    react: 16.13.1 => 16.13.1
    react-native: https://github.com/expo/react-native/archive/sdk-39.0.4.tar.gz => 0.63.2
    react-native-windows: Not Found
  npmGlobalPackages:
    *react-native*: Not Found

Steps To Reproduce

Using the Snack below under Android (tested on Pixel 3 with Android 11)

  1. Connect a physical keyboard to the Android device, either using USB or Bluetooth. If using an emulator, you may need to configure it to send keyboard shortcuts to the virtual device; I’ve had better luck reproing on physical devices, though.
  2. Press Tab and Shift+Tab to move the focus between the Buttons and TextInput
  3. Observe that pressing Tab when focused on the element before the TextInput or Shift+Tab on the element after the TextInput does not move the focus to the TextInput. Additionally, if you tap to activate the TextInput, you cannot press Tab/Shift+Tab to leave the TextInput.

Expected Results

The TextInput should participate in the keyboard tab order. Users may use a physical keyboard for accessibility reasons.

Snack, code example, screenshot, or link to a repository:

https://snack.expo.io/dg2qxBBue

Issue Analytics

  • State:open
  • Created 3 years ago
  • Reactions:1
  • Comments:11

github_iconTop GitHub Comments

4reactions
kriti18singhcommented, May 11, 2021

@fabriziobertoglio1987 the workaround does not seem to work. Wrapping the TextInput in a Touchable and then tabbing never fires the onFocus of the touchable. Tried this a couple of times but it didn’t work. onPress of the TouchableHighlight and TouchableNativeFeedback is fired but never onFocus. Also, I have a button below the text input, if the current keyboard focus is on the button - doing shift + tab does not take it back to the input (touchable wrapped input did not work here). Are you aware of any other workarounds?

1reaction
NatPricommented, May 7, 2021

I was moved to a different project before I could revisit this, so unfortunately I don’t know where this ended up, sorry.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Unable to focus on TextInput by pressing Tab from physical ...
In the simulator the keyboard tabbing works but it gets stuck on the input container only, it only focuses on the first label....
Read more >
Input from Hardware Keyboard Loses Focus - android
The virtual keyboard works just fine to enter text into using inputType set, but the hardware keyboard (on Droid, Droid 2, etc) does...
Read more >
Assessment of Keyboard Interface Accessibility in Mobile ...
For example, on Android devices, after using the D-pad controls to move focus to a button, the user can press Enter to activate...
Read more >
Handle input method visibility | Android Developers
When input focus moves in or out of an editable text field, Android shows or hides the input method—such as the on-screen keyboard—as ......
Read more >
Keyboard input in Unity - Mixed Reality | Microsoft Learn
While HoloLens supports many forms of input including Bluetooth keyboards, most applications can't assume that all users will have a physical ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found