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.

Sign up for GitHub

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

Jump to bottom

feat: Add aria-hidden prop to Pressable, View and Touchables components #34552

Closed
wants to merge 2 commits into from
Closed

feat: Add aria-hidden prop to Pressable, View and Touchables components #34552

wants to merge 2 commits into from

Conversation

gabrieldonadel
Copy link
Collaborator

@gabrieldonadel gabrieldonadel commented Sep 1, 2022 •
edited
Loading

Summary

This adds the aria-hidden prop to Pressable, TouchableBounce, TouchableHighlight, TouchableNativeFeedback, TouchableOpacity, TouchableWithoutFeedback and View components as requested on #34424, being an alias importantforAccessibility='no-hide-descendants' on Android and an alias for accessibilityElementsHidden on iOS. This PR also updates RNTester AccessibilityExample in order to facilitate the manual QA.

Changelog

[General] [Added] - Add aria-hidden prop to Pressable, View and Touchables components

Test Plan

  1. Open the RNTester app and navigate to the Accessibility page
  2. Test the aria-hidden prop through the View with hidden children from accessibility tree section, this can be tested either by enabling Voice Over if you're using a real device or through the Accessibility Inspector if you're using a simulator
Screen.Recording.2022-08-31.at.22.43.30.mov

@facebook-github-bot facebook-github-bot added the CLA Signed This label is managed by the Facebook bot. Authors need to sign the CLA before a PR can be reviewed. label Sep 1, 2022
@react-native-bot react-native-bot added the Type: Enhancement A new feature or enhancement of an existing feature. label Sep 1, 2022
@facebook-github-bot facebook-github-bot added the Shared with Meta Applied via automation to indicate that an Issue or Pull Request has been shared with the team. label Sep 1, 2022
@analysis-bot
Copy link

analysis-bot commented Sep 1, 2022 •
edited
Loading

Platform Engine Arch Size (bytes) Diff
android hermes arm64-v8a 7,638,157 +228
android hermes armeabi-v7a 7,050,151 +223
android hermes x86 7,940,123 +232
android hermes x86_64 7,912,146 +225
android jsc arm64-v8a 9,514,021 +273
android jsc armeabi-v7a 8,289,318 +273
android jsc x86 9,453,560 +273
android jsc x86_64 10,044,809 +271

Base commit: a50e6fb
Branch: main

@analysis-bot
Copy link

analysis-bot commented Sep 1, 2022 •
edited
Loading

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

Base commit: a50e6fb
Branch: main

@facebook-github-bot
Copy link
Contributor

@jacdebug has imported this pull request. If you are a Meta employee, you can view this diff on Phabricator.

@gabrieldonadel gabrieldonadel mentioned this pull request Sep 1, 2022
Closed
@necolas necolas mentioned this pull request Sep 1, 2022
Closed
70 tasks
@necolas
Copy link
Contributor

necolas commented Sep 1, 2022

We should also add this to Text and other core components.

@gabrieldonadel gabrieldonadel changed the title feat: Add aria-hidden prop to View component feat: Add aria-hidden prop to Pressable, View and Touchables components Sep 2, 2022
@gabrieldonadel
Copy link
Collaborator Author

We should also add this to Text and other core components.

Hi @necolas, my bad I forgot to update the other components, I've just pushed a commit adding aria-hidden to Pressable, TouchableBounce, TouchableHighlight, TouchableNativeFeedback, TouchableOpacity, TouchableWithoutFeedback. I couldn't add it to the Text component tho as it does not seem to support either importantforAccessibility or accessibilityElementsHidden (at least not based on https://github.com/facebook/react-native/blob/c34659a5d3ef24e6a0ace2a5cac242487225fed0/Libraries/Text/TextProps)

facebook-github-bot pushed a commit that referenced this pull request Sep 5, 2022
@gabrieldonadel @facebook-github-bot
fix: Accessibility example typos (#34559)
1dd74db 
Summary:
While working on #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: #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
@facebook-github-bot
Copy link
Contributor

@jacdebug has imported this pull request. If you are a Meta employee, you can view this diff on Phabricator.

@facebook-github-bot
Copy link
Contributor

@jacdebug has imported this pull request. If you are a Meta employee, you can view this diff on Phabricator.

@react-native-bot
Copy link
Collaborator

This pull request was successfully merged by @gabrieldonadel in ebdb23c.

When will my fix make it into a release? | Upcoming Releases

@react-native-bot react-native-bot added the Merged This PR has been merged. label Sep 7, 2022
@gabrieldonadel gabrieldonadel deleted the feat/add-aria-hidden-to-view branch September 7, 2022 22:18
OlimpiaZurek pushed a commit to OlimpiaZurek/react-native that referenced this pull request May 22, 2023
@gabrieldonadel @OlimpiaZurek
feat: Add aria-hidden prop to Pressable, View and Touchables componen…
ea5a3a5 
…ts (facebook#34552)

Summary:
This adds the ` aria-hidden` prop to `Pressable`, `TouchableBounce`, `TouchableHighlight`, `TouchableNativeFeedback`, `TouchableOpacity`, `TouchableWithoutFeedback` and `View` components as requested on facebook#34424, being an alias `importantforAccessibility='no-hide-descendants'` on Android and an alias for `accessibilityElementsHidden` on iOS. This PR also updates RNTester AccessibilityExample in order to facilitate the manual QA.

## Changelog

[General] [Added] -  Add aria-hidden prop to Pressable, View and Touchables components

Pull Request resolved: facebook#34552

Test Plan:
1. Open the RNTester app and navigate to the Accessibility page
2. Test the `aria-hidden` prop through the `View with hidden children from accessibility tree` section, this can be tested either by enabling Voice Over if you're using a real device or through the Accessibility Inspector if you're using a simulator

https://user-images.githubusercontent.com/11707729/187814455-6937e33e-7edd-434e-b7d3-ee6c03f635ca.mov

Reviewed By: NickGerleman

Differential Revision: D39206245

Pulled By: jacdebug

fbshipit-source-id: 551dc671fbcedc824f253e22b8d7753c466838c7
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers
No reviews
Assignees
No one assigned
Labels
CLA Signed This label is managed by the Facebook bot. Authors need to sign the CLA before a PR can be reviewed. Merged This PR has been merged. Needs TypeScript Update Shared with Meta Applied via automation to indicate that an Issue or Pull Request has been shared with the team. Type: Enhancement A new feature or enhancement of an existing feature.
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
6 participants
@gabrieldonadel @analysis-bot @facebook-github-bot @necolas @react-native-bot @jacdebug