Skip to content

Conversation

Saadnajmi
Copy link
Collaborator

Please select one of the following

  • I am removing an existing difference between facebook/react-native and microsoft/react-native-macos 👍
  • I am cherry-picking a change from Facebook's react-native into microsoft/react-native-macos 👍
  • I am making a fix / change for the macOS implementation of react-native
  • I am making a change required for Microsoft usage of react-native

Summary

In React Native Windows, Pressable will by default handle onKeyUp / onKeyDown to call onPress / onPressIn / onPressOut. We were missing that in React Native macOS, due to differences in our keyboard event API. React Native Windows sends all keyboard events to JS, whereas React Native macOS only sends keyboard events to JS if validKeysUp / validKeysDown is specified.

Let's implement this default keyboard handling for Pressable in React Native macOS as well. The logic added is mostly a copy of the logic in React Native Windows with a few key differences:

  1. We add a default validKeysDown prop if the calling code doesn't specify one. This is needed due the API difference mentioned above.
  2. We fire onPress with onKeyDown instead of onKeyUp. This is a platform difference between Windows and macOS. In Windows natively, button presses are preferred to be fired with onKeyUp. Furthermore, you can "cancel" a button press by pressing Tab in between your keyDown and your keyUp. This quirk is not present in native macOS.
  3. Because of (2), I chose not to port the following change, where one can cancel the onPress microsoft/react-native-windows@ed1e85e

Changelog

[macOS] [Changed] - Add default handling of Space and Enter to Pressable

Test Plan

In progress...

@analysis-bot
Copy link

Platform Engine Arch Size (bytes) Diff
ios - universal n/a --

Base commit: f52aa9b
Branch: main

@tom-un
Copy link
Collaborator

tom-un commented Jan 10, 2023

Made #1623 which is the same fix in Pressability.js but instead of making default validKeysDown props for Pressable, made the validKeysDown/Up props implicit default contain Enter and Space in RCTView so that the same behavior works in Touchables, Button, etc.

@Saadnajmi
Copy link
Collaborator Author

Closing in favor of #1623

@Saadnajmi Saadnajmi closed this Jan 10, 2023
@Saadnajmi Saadnajmi deleted the pressable-defaults branch January 15, 2023 23:46
@Saadnajmi Saadnajmi restored the pressable-defaults branch January 15, 2023 23:46
@Saadnajmi Saadnajmi deleted the pressable-defaults branch April 6, 2023 23:28
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants