Skip to content

Allow Switch to use default UISwitch accessibility annoucements #50796

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

Closed
wants to merge 1 commit into from

Conversation

joevilches
Copy link
Contributor

Summary:
When we render a Switch today we are never actually focusing on the native UISwitch that gets rendered. We instead focus on the parent RCTViewComponentView which houses the UISwitch as a contentView. That is because of this logic. This blocks the accessibility of any descendants, including the contentView.

What we lose here is the announcement of "on" and "off" based on the toggle state that comes built into UISwitch. To do this today you need to add accessibilityState={{checked: ...}} which is very unintuitive. Android DOES announce "on" and "off".

We can fix this with an override on the switch class.

Changelog: [iOS][Fixed] - Fix "on" and "off" announcements on Switch

Differential Revision: D73226500

@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 Apr 18, 2025
@facebook-github-bot
Copy link
Contributor

This pull request was exported from Phabricator. Differential Revision: D73226500

joevilches added a commit to joevilches/react-native that referenced this pull request Apr 18, 2025
…book#50796)

Summary:

When we render a `Switch` today we are never actually focusing on the native `UISwitch` that gets rendered. We instead focus on the parent `RCTViewComponentView` which houses the `UISwitch` as a `contentView`. That is because of [this logic](https://www.internalfb.com/code/fbsource/[b7e1547dab5a]/xplat/js/react-native-github/packages/react-native/React/Fabric/Mounting/ComponentViews/View/RCTViewComponentView.mm?lines=1211-1213). This blocks the accessibility of any descendants, including the `contentView`. 

What we lose here is the announcement of "on" and "off" based on the toggle state that comes built into `UISwitch`. To do this today you need to add `accessibilityState={{checked: ...}}` which is very unintuitive. Android DOES announce "on" and "off".

We can fix this with an override on the switch class.

Changelog: [iOS][Fixed] - Fix "on" and "off" announcements on `Switch`

Reviewed By: realsoelynn

Differential Revision: D73226500
…book#50796)

Summary:
Pull Request resolved: facebook#50796

When we render a `Switch` today we are never actually focusing on the native `UISwitch` that gets rendered. We instead focus on the parent `RCTViewComponentView` which houses the `UISwitch` as a `contentView`. That is because of [this logic](https://www.internalfb.com/code/fbsource/[b7e1547dab5a]/xplat/js/react-native-github/packages/react-native/React/Fabric/Mounting/ComponentViews/View/RCTViewComponentView.mm?lines=1211-1213). This blocks the accessibility of any descendants, including the `contentView`.

What we lose here is the announcement of "on" and "off" based on the toggle state that comes built into `UISwitch`. To do this today you need to add `accessibilityState={{checked: ...}}` which is very unintuitive. Android DOES announce "on" and "off".

We can fix this with an override on the switch class.

Changelog: [iOS][Fixed] - Fix "on" and "off" announcements on `Switch`

Reviewed By: realsoelynn

Differential Revision: D73226500
@facebook-github-bot
Copy link
Contributor

This pull request was exported from Phabricator. Differential Revision: D73226500

@facebook-github-bot facebook-github-bot added the Merged This PR has been merged. label Apr 18, 2025
@facebook-github-bot
Copy link
Contributor

This pull request has been merged in db6e000.

@react-native-bot
Copy link
Collaborator

This pull request was successfully merged by @joevilches in db6e000

When will my fix make it into a release? | How to file a pick request?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
CLA Signed This label is managed by the Facebook bot. Authors need to sign the CLA before a PR can be reviewed. fb-exported Merged This PR has been merged. p: Facebook Partner: Facebook Partner
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants