Gabriel Donadel Dall'Agnol
1dd74db31f
fix: Accessibility example typos ( #34559 )
...
Summary:
While working on https://github.com/facebook/react-native/pull/34552 I noticed that a couple of words inside the Accessibility example files were misspelled.
## Changelog
[Internal] [Fixed] - Fix accessibility example typos
Pull Request resolved: https://github.com/facebook/react-native/pull/34559
Test Plan: Shouldn't require much testing as this is just fixing some typos inside Accessibility example
Reviewed By: cipolleschi
Differential Revision: D39252742
Pulled By: jacdebug
fbshipit-source-id: 0d3860f438c55d58d0816b9ae65e52925864c8d3
2022-09-05 05:11:07 -07:00
fabriziobertoglio1987
7b5b114d57
Making links independently focusable by Talkback ( #33215 )
...
Summary:
This issue fixes [32004][23]. The Pull Request was previously published by [blavalla][10] with [31757][24].
>This is a follow-up on [D23553222 (https://github.com/facebook/react-native/commit/b352e2da8137452f66717cf1cecb2e72abd727d7 )][18], which made links functional by using [Talkback's Links menu][1]. We don't often use this as the sole access point for links due to it being more difficult for users to navigate to and easy for users to miss if they don't listen to the full description, including the hint text that announces that links are available.
The Implementation of the functionality consists of:
Retrieving the accessibility links and triggering the TalkBack Focus over the Text
1. nested Text components with accessibilityRole link are saved as [ReactClickableSpan][17] instances in Android native [TextView][20] ([more info][19])
1. If the TextView contains any [ClickableSpans][15] (which are [nested Text][14] components with role link), set a view tag and reset the accessibility delegate.
3. Obtain each link description, start, end, and position relative to the parent Text (id) from the Span as an [AccessibilityLink][16]
4. Use the [AccessibilityLink][16] to display TalkBack focus over the link with the `getVirtualViewAt` method (more [info][13])
Implementing ExploreByTouchHelper to detect touches over links and to display TalkBack rectangle around them.
1. ReactAccessibilityDelegate inherits from [ExploreByTouchHelper][12]
2. If the [ReactTextView][21] has an accessibility delegate, trigger ExploreByTouchHelper method [dispatchHoverEvent][22]
3. Implements the methods `getVirtualViewAt` and `onPopulateBoundsForVirtualView`.
The two methods implements the following functionalities (more [info][13]):
* detecting the TalkBack onPress/focus on nested Text with accessibilityRole="link"
* displaying TalkBack rectangle around nested Text with accessibilityRole="link"
## Changelog
[Android] [Added] - Make links independently focusable by Talkback
Pull Request resolved: https://github.com/facebook/react-native/pull/33215
Test Plan:
[1]. User Interacts with links through TalkBack default accessibility menu ([link][1])
[2]. The nested link becomes the next focusable element after the parent element that contains it. ([link][2])
[3]. Testing accessibility examples in pr branch ([link][3])
[4]. Testing accessibility android examples in pr branch ([link][4])
[7]. TalkBack focus moves through links in the correct order from top to bottom (PR Branch with [link.id][25]) ([link to video test][7]) ([discussion][26])
[8]. TalkBack focus does not move through links in the correct order from top to bottom (PR Branch without [link.id][25]) ([link to video test][8]) ([discussion][26])
Test on main branch
[5]. Testing accessibility examples in main branch ([link][5])
[6]. Testing accessibility android examples in main branch ([link][6])
[1]: https://github.com/fabriziobertoglio1987/react-native-notes/issues/9#issuecomment-1045593386
[2]: https://github.com/fabriziobertoglio1987/react-native-notes/issues/9#issuecomment-1045593164
[3]: https://github.com/fabriziobertoglio1987/react-native-notes/issues/9#issuecomment-1054900872
[4]: https://github.com/fabriziobertoglio1987/react-native-notes/issues/9#issuecomment-1054918634
[5]: https://github.com/fabriziobertoglio1987/react-native-notes/issues/9#issuecomment-1054888278
[6]: https://github.com/fabriziobertoglio1987/react-native-notes/issues/9#issuecomment-1054891828
[7]: https://github.com/fabriziobertoglio1987/react-native-notes/issues/9#issuecomment-1060073165
[8]: https://github.com/fabriziobertoglio1987/react-native-notes/issues/9#issuecomment-1060098381
[10]: https://github.com/blavalla "blavalla github profile"
[12]: https://github.com/aosp-mirror/platform_frameworks_base/blob/1ac46f932ef88a8f96d652580d8105e361ffc842/core/java/com/android/internal/widget/ExploreByTouchHelper.java#L48 "com/android/internal/widget/ExploreByTouchHelper.java#L48"
[13]: https://github.com/fabriziobertoglio1987/react-native-notes/issues/9#issuecomment-1046384200 "explanation of getVirtualViewAt and onPopulateBoundsForVirtualView"
[14]: https://github.com/aosp-mirror/platform_frameworks_base/blob/1ac46f932ef88a8f96d652580d8105e361ffc842/core/java/android/text/Spannable.java#L3 "core/java/android/text/Spannable.java#L3"
[15]: https://github.com/fabriziobertoglio1987/react-native/blob/561266fc180b96d6337d6c6c5c3323522d66cc44/ReactAndroid/src/main/java/com/facebook/react/views/text/ReactTextViewManager.java#L70-L71 "react/views/text/ReactTextViewManager.java#L70-L71"
[16]: https://github.com/fabriziobertoglio1987/react-native/blob/561266fc180b96d6337d6c6c5c3323522d66cc44/ReactAndroid/src/main/java/com/facebook/react/uimanager/ReactAccessibilityDelegate.java#L680-L685 "react/uimanager/ReactAccessibilityDelegate.java#L680-L685"
[17]: https://github.com/facebook/react-native/blob/561266fc180b96d6337d6c6c5c3323522d66cc44/ReactAndroid/src/main/java/com/facebook/react/views/text/TextLayoutManager.java#L126-L129 "react/views/text/TextLayoutManager.java#L126-L129"
[18]: https://github.com/facebook/react-native/commit/b352e2da8137452f66717cf1cecb2e72abd727d7
[19]: https://github.com/facebook/react-native/issues/30375#issuecomment-781494859 "explanation on how nested Text are converted to Android Spans"
[20]: https://github.com/aosp-mirror/platform_frameworks_base/blob/1ac46f932ef88a8f96d652580d8105e361ffc842/core/java/android/widget/TextView.java#L214-L220 "core/java/android/widget/TextView.java#L214-L220"
[21]: https://github.com/facebook/react-native/blob/485cf6118b0ab0b59e078b96701b69ae64c4dfb7/ReactAndroid/src/main/java/com/facebook/react/views/text/ReactTextView.java#L577 "dispatchHoverEvent in ReactTextView"
[22]: https://github.com/aosp-mirror/platform_frameworks_base/blob/1ac46f932ef88a8f96d652580d8105e361ffc842/core/java/com/android/internal/widget/ExploreByTouchHelper.java#L120-L138 "dispatchHoverEvent in ExploreByTouchHelper"
[23]: https://github.com/facebook/react-native/issues/32004
[24]: https://github.com/facebook/react-native/pull/31757
[25]: https://github.com/fabriziobertoglio1987/react-native/blob/485cf6118b0ab0b59e078b96701b69ae64c4dfb7/ReactAndroid/src/main/java/com/facebook/react/uimanager/ReactAccessibilityDelegate.java#L648 "setting link.id in the AccessibilityLink constructor"
[26]: https://github.com/facebook/react-native/pull/33215/files/485cf6118b0ab0b59e078b96701b69ae64c4dfb7#r820014411 "comment on role of link.id"
Reviewed By: blavalla
Differential Revision: D34687371
Pulled By: philIip
fbshipit-source-id: 8e63c70e9318ad8d27317bd68497705e595dea0f
2022-03-29 13:36:24 -07:00
Andres Suarez
8bd3edec88
Update copyright headers from Facebook to Meta
...
Reviewed By: aaronabramov
Differential Revision: D33367752
fbshipit-source-id: 4ce94d184485e5ee0a62cf67ad2d3ba16e285c8f
2021-12-30 15:11:21 -08:00
Siddharth Verma
903eae4915
Add @flow types in AccessibilityAndroidExample.android.js ( #31428 )
...
Summary:
[AccessibilityAndroidExample.android.js](https://github.com/facebook/react-native/blob/master/packages/rn-tester/js/examples/Accessibility/AccessibilityAndroidExample.android.js ) does not have proper Flow types. Without Flow typing enforced, it is easy for bugs to be introduced when making changes to this file.
### Changelog
[General] [Added] - Added the flow annotation to `AccessibilityAndroidExample.android.js `
[General] [Added] - Updated the file to use [flow strict-local](https://flow.org/en/docs/strict/#toc-strict-local )
Pull Request resolved: https://github.com/facebook/react-native/pull/31428
Test Plan: Run `flow-check-android` with No Errors in code.
Reviewed By: lunaleaps
Differential Revision: D28334312
Pulled By: kacieb
fbshipit-source-id: 5a1a34da684cb34ded01d9368faae02916cca3bb
2021-05-12 16:13:09 -07:00
stealthanthrax
63992c0b96
Migrating RNTester to Packages Directory ( #29567 )
...
Summary:
## Changelog
<!-- Help reviewers and the release process by writing your own changelog entry. For an example, see:
https://github.com/facebook/react-native/wiki/Changelog
-->
This PR aims to migrate the RNTester App to `packages` directory. But is currently, open to inspect the CI issues and resolve the merge conflicts.
Currently done
- Working on iOS
- Working on Android
- Detox Tests working on iOS
Need to work on
- Errors generated by the CI builds
[General] [Changed] - Migrated the RNTester App to the packages directory.
Pull Request resolved: https://github.com/facebook/react-native/pull/29567
Test Plan: It runs on both ios and android for now and the detox iOS builds are working.
Reviewed By: cpojer
Differential Revision: D23034761
Pulled By: rickhanlonii
fbshipit-source-id: e04bb06e1c7ef15d340206090d1575a871b9e6f5
2020-08-19 17:57:08 -07:00
Gabriel Donadel Dall'Agnol
fabriziobertoglio1987
Andres Suarez
Siddharth Verma
stealthanthrax