Fix long-press gestures not working in RichText component [Android]
#54213
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
fluiddot
added
[Type] Bug
|
Size Change: 0 B Total Size: 1.52 MB ℹ️ View Unchanged
|
fluiddot
force-pushed
the
rnmobile/fix/rich-text-android-long-press-gestures
branch
from
6c2f31b
to
1d77fea
Compare
fluiddot
added
[Focus] Accessibility (a11y)
geriux
approved these changes
Sep 6, 2023
There was a problem hiding this comment.
LGTM! Thank you for quickly fixing this bug!
For Android, I've tested on both a Redmi Note 8T (OS Android 11) and Samsung A23 5G (OS Android 13)
- ✅ Long-pressing to paste content
- ✅ Long-pressing to change the caret and detect the current formatting
- ✅ Drag&Drop
- ✅ Using TalkBack to select different blocks and move around the editor
- ✅ Using TalkBack with the Braille Screen input to update Text-based blocks
On iOS, I've tested using an iPhone 14 Pro (iOS 16.6) and an iPad (10th gen OS 16.6)
- ✅ Long-pressing to paste content
- ✅ Long-pressing to change the caret and detect the current formatting
- ✅ Drag&Drop
- ✅ Using VoiceOver to select different blocks
- ✅ Using VoiceOver with the Braille Screen Input to update text-based blocks, Paragraph, Title, HTML editor, search box.
- ✅ Using an external Keyboard with VoiceOver enabled.
fluiddot
deleted the
rnmobile/fix/rich-text-android-long-press-gestures
branch
fluiddot
added a commit
that referenced
this pull request
Sep 6, 2023
…#54213) * Use different touchable components in RichText based on platform * Update mobile test snapshots
4 tasks
fluiddot
added a commit
that referenced
this pull request
Sep 7, 2023
* Release script: Update react-native-editor version to 1.103.0 * Release script: Update with changes from 'npm run core preios' * Update Changelog * Update package-lock.json * Release script: Update react-native-editor version to 1.103.1 * Release script: Update with changes from 'npm run core preios' * Fix long-press gestures not working in `RichText` component [Android] (#54213) * Use different touchable components in RichText based on platform * Update mobile test snapshots * Update `package-lock.json` file * Update `react-native-editor` changelog * Update `package-lock.json` file due to wrong conflict resolution --------- Co-authored-by: Gerardo <gerardo.pacheco@automattic.com>
geriux
added a commit
that referenced
this pull request
Sep 11, 2023
* Release script: Update react-native-editor version to 1.103.0 * Release script: Update with changes from 'npm run core preios' * Update Changelog * Update package-lock.json * Release script: Update react-native-editor version to 1.103.1 * Release script: Update with changes from 'npm run core preios' * Fix long-press gestures not working in `RichText` component [Android] (#54213) * Use different touchable components in RichText based on platform * Update mobile test snapshots * Update `package-lock.json` file * Update `react-native-editor` changelog * Release script: Update react-native-editor version to 1.103.2 * Release script: Update with changes from 'npm run core preios' * [RNMobile] Fix issue with missing characters in Add Media placeholder button (#54281) * Fix media placeholder text issue * Update CHANGELOG * Update Gallery block media placeholder text * Update letter case for File block button * Update package-lock.json --------- Co-authored-by: Carlos Garcia <fluiddot@gmail.com> Co-authored-by: Derek Blank <derekpblank@gmail.com>
fluiddot
added a commit
that referenced
this pull request
Sep 14, 2023
* Release script: Update react-native-editor version to 1.103.0 * Release script: Update with changes from 'npm run core preios' * Update Changelog * Update package-lock.json * Release script: Update react-native-editor version to 1.103.1 * Release script: Update with changes from 'npm run core preios' * Fix long-press gestures not working in `RichText` component [Android] (#54213) * Use different touchable components in RichText based on platform * Update mobile test snapshots * Update `package-lock.json` file * Update `react-native-editor` changelog * Release script: Update react-native-editor version to 1.103.2 * Release script: Update with changes from 'npm run core preios' * [RNMobile] Fix issue with missing characters in Add Media placeholder button (#54281) * Fix media placeholder text issue * Update CHANGELOG * Update Gallery block media placeholder text * Update letter case for File block button * Update package-lock.json * Release script: Update react-native-editor version to 1.103.3 * Release script: Update with changes from 'npm run core preios' * Bump Aztec-iOS version * Update `package-lock.json` file * Update `react-native-editor` changelog --------- Co-authored-by: Gerardo <gerardo.pacheco@automattic.com> Co-authored-by: Derek Blank <derekpblank@gmail.com>
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Related PRs:
RichTextcomponent [Android] wordpress-mobile/gutenberg-mobile#6162What?
The PR fixes a regression on Android introduced in Gutenberg Mobile
1.103.0that affects theRichTextcomponent. Specifically, the long-press gestures are not working. This means that some of the text input functionalities like opening the context menu to copy/paste content, as well as moving the caret, are not available.Why?
Fixes #54210.
How?
In #53895, we replaced the touchable component (
TouchableWithoutFeedback) used in the Aztec view to address an accessibility issue on iOS. The new touchable component used (Pressable) seems to be absorbing the long-press gestures and therefore preventing some of the text input functionality. As a workaround, this PR uses a different touchable component based on the platform:TouchableWithoutFeedback(Previous component)PressableEventually, we should remove the touchable component and implement the
onPressevent directly in the Aztec native component.Testing Instructions
PRs with installable builds:
Long-press gestures work on Android
Accessibility works on Android
Preparation:
Go to TalkBack configuration and enable Braille input (Configuration/Accessibility/TalkBack/Settings/Braille keyboard).
Accessibility works on iOS
Follow testing instructions from #53895 to verify that no regressions are introduced.
Testing Instructions for Keyboard
N/A
Screenshots or screencast
android-long-press-gestures-fix.mp4
android-talkback-braille-input.mp4