Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

onLongPress does not fire with phsyical keyboard #34023

Open
aweary opened this issue Jun 17, 2022 · 7 comments
Open

onLongPress does not fire with phsyical keyboard #34023

aweary opened this issue Jun 17, 2022 · 7 comments
Labels
Accessibility Team - Evaluated Accessibility API: Keyboard Needs: Repro This issue could be improved with a clear list of steps to reproduce the issue. Needs: Triage 🔍

Comments

@aweary
Copy link

aweary commented Jun 17, 2022

Description

There is no way to trigger onLongPress or other press events like onPressIn or onPressOut when using a physical keyboard connected to the mobile device. This is a big accessibility issue as it prevents interactions that utilize onLongPress from being keyboard operable in violation of https://www.w3.org/TR/mobile-accessibility-mapping/#keyboard-control-for-touchscreen-devices

Version

0.66.0

Output of npx react-native info

System:
OS: macOS 12.1
CPU: (10) x64 Apple M1 Max
Memory: 3.20 GB / 64.00 GB
Shell: 5.8 - /bin/zsh
Binaries:
Node: 14.19.0 - ~/.nix-profile/bin/node
Yarn: 1.19.2 - ~/.nix-profile/bin/yarn
npm: 6.14.16 - ~/.nix-profile/bin/npm
Watchman: 4.9.0 - /Users/brandon.dail/.nix-profile/bin/watchman
Managers:
CocoaPods: 1.11.0 - /Users/brandon.dail/.nix-profile/bin/pod
SDKs:
iOS SDK:
Platforms: DriverKit 21.2, iOS 15.2, macOS 12.1, tvOS 15.2, watchOS 8.3
Android SDK:
API Levels: 31, 32
Build Tools: 30.0.2
System Images: android-31 | Google Play ARM 64 v8a, android-32 | Google Play ARM 64 v8a
Android NDK: Not Found
IDEs:
Android Studio: 2021.1 AI-211.7628.21.2111.8193401
Xcode: 13.2.1/13C100 - /usr/bin/xcodebuild
Languages:
Java: 11.0.11 - /Users/brandon.dail/.nix-profile/bin/javac
npmPackages:
@react-native-community/cli: Not Found
react: 17.0.2 => 17.0.2
react-native: https://github.com/discord/react-native/archive/aa6fc55f1f65a92bc4a10ac4f38cc26d35e6ced2.tar.gz => 0.68.1
react-native-macos: Not Found
npmGlobalPackages:
react-native: Not Found

Steps to reproduce

  • Connect a physical keyboard to an Android or iOS device
  • Navigate to any Pressable or View that might support onLongPress
  • Hold down the Space key on the physical keyboard

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

Just render any <Pressable onLongPress={callback}>

@alextait1
Copy link

alextait1 commented Jun 22, 2022

Hey @aweary thanks for submitting we'll try to reproduce on our end, and report back. Do you have any details/environments of where you're experiencing these issues?

@aweary
Copy link
Author

aweary commented Jun 22, 2022

@alextait1 as far as I can tell it should be reproducible in any environment that is rendering a Pressable with an onLongPress listener. I am using a Logitech K380 Multi-Device Bluetooth Keyboard with both an iOS and Android device.

@blavalla
Copy link
Contributor

@aweary , so I did some tests (and have the same keyboard as you even!) and you're correct, right now onLongPress doesn't work with keyboards. The reason for this seems to be that in general Pressability doesn't technically have any support for keyboards baked in. It's relying solely on the OS-level behavior which triggers standard onClick/onTouch events when a user hits enter/spacebar.

On iOS, you can set up a keyboard shortcut for "Touch" (rather than the default spacebar shortcut which triggers "Activate"), and if you hold the key you set down, it does in fact trigger a long-press. Again, this works by the OS simulating an actual touch event that Pressable detects.

On Android there doesn't seem to be a way to create custom keyboard shortcuts, or remap existing ones, and there is unfortunately no shortcut I can find that will trigger a long press.

In theory, this is something that RN could add support for on its own, as both Android and iOS have ways to trigger behavior based on keyboard keypress. If this is something that's blocking you, and you want to put up a PR I'd be happy to review it :)

@blavalla
Copy link
Contributor

Just as a follow up here, while Android has no way to customize keyboard shortcuts in a general sense, specific accessibility services can customize their keyboard shortcuts.

Talkback for example, does allow keyboard shortcut customization, and even has a shortcut for long press (Alt+Shift+Enter by default).

So while I think this system could be improved upon (there really should be some OS-level customization here), it would really require an OS update from Google to make this better.

My fear is that if we tried to polyfill this in RN by listening for keypress events that we'd end up in conflict with services that do properly support keyboard shortcuts, and could cause problems for users relying on them.

@github-actions
Copy link

This issue is stale because it has been open 180 days with no activity. Remove stale label or comment or this will be closed in 7 days.

@github-actions github-actions bot added the Stale There has been a lack of activity on this issue and it may be closed soon. label Apr 19, 2023
@ArturKalach
Copy link

Hello thread,
I wrote a libarary for solving this issue:
https://www.npmjs.com/package/react-native-external-keyboard

This library also includes:

  • handling component focus
  • api for moving keyboard force
  • key press hendling

New and old arch are supported.

@github-actions github-actions bot added the Needs: Repro This issue could be improved with a clear list of steps to reproduce the issue. label Jul 19, 2023
@github-actions github-actions bot removed the Stale There has been a lack of activity on this issue and it may be closed soon. label Feb 17, 2024
@vgowda-indeed
Copy link

Hello,

The https://www.npmjs.com/package/react-native-external-keyboard library didn't work.
What's the priority of this issue? Is there any timeline as to when the issue will be fixed? Thanks!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Accessibility Team - Evaluated Accessibility API: Keyboard Needs: Repro This issue could be improved with a clear list of steps to reproduce the issue. Needs: Triage 🔍
Projects
None yet
Development

No branches or pull requests

6 participants