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

Switch Component doesn't disable click functionality when disabled #30944

Closed
amarlette opened this issue Feb 10, 2021 · 7 comments
Closed

Switch Component doesn't disable click functionality when disabled #30944

amarlette opened this issue Feb 10, 2021 · 7 comments
Labels
Accessibility Component: Switch Good first issue Interested in collaborating? Take a stab at fixing one of these issues. Platform: Android Android applications. Resolution: Locked This issue was locked by the bot.

Comments

@amarlette
Copy link

amarlette commented Feb 10, 2021 •
edited
Loading

Description

When using a screen reader the Switch component doesn't disable click functionality.

This issue is covered in-depth by parent issue #30840, please check there for more details.

Issue #30706 is similar to this issue and should be taken into account when creating a solution.

React Native version:

0.63
@amarlette amarlette mentioned this issue Feb 10, 2021
Closed
19 tasks
@amarlette amarlette added Good first issue Interested in collaborating? Take a stab at fixing one of these issues. and removed Needs: Triage 🔍 labels Mar 5, 2021
@amarlette amarlette mentioned this issue Mar 18, 2021
Closed
@fabOnReact fabOnReact mentioned this issue Mar 19, 2021
Closed
@wertlop
Copy link

wertlop commented Jun 2, 2021

Can I take this issue?

@amarlette
Copy link
Author

@wertlop yes you are welcome to pick up this issue. Please mention the issue number in your pull request so that it links back. Thank you!

@smash-96
Copy link

smash-96 commented Aug 4, 2021 •
edited
Loading

@amarlette Hi, I'd like to work on this issue if it is still available
I see that the issue is still in backlog and has no updates. It says @fabriziobertoglio1987 closed it but the issue is still open.

Kindly clarify and let me know, thankyou!

@mdaj06
Copy link
Contributor

mdaj06 commented Sep 2, 2021

hi @amarlette! i can have a go at this if its still open

@fabOnReact

This comment was marked as off-topic.

Sign in to view
@fabOnReact fabOnReact mentioned this issue Feb 7, 2022
Closed
fabOnReact added a commit to fabOnReact/react-native that referenced this issue Feb 8, 2022
@fabOnReact
removing changes to Switch iOS (SwitchNativeComponent)
135c562 
facebook#30944 is tagged as
Platform Android.
@fabOnReact
Copy link
Contributor

fabOnReact commented Feb 8, 2022 •
edited
Loading

I have a pull request ready for this issue. I will publish it soon. More information in the discussion fabOnReact/react-native-notes#5. Thanks 🙏

@fabOnReact fabOnReact mentioned this issue Feb 9, 2022
Closed
@fabOnReact
Copy link
Contributor

@blavalla
I published #33070 to fix this issue.
The PR is in DRAFT. I will complete the PR in a couple of days.
Thanks 🙏

Saadnajmi pushed a commit to Saadnajmi/react-native-macos that referenced this issue Jan 15, 2023
@fabOnReact @Saadnajmi
Switch component does not disable click (facebook#33070)
c098dca 
Summary:
This issue fixes facebook#30944 fixes facebook#30840 ([Test Case 7.1][7.1], [Test Case 7.3][7.3], [Test Case 7.5][7.5]) which affects Platform Android. Previous PR facebook#31199.
The issue is caused by the missing prop `accessibilityState` in the Switch component.

The solution consists of passing the accessibilityState to the `AndroidSwitchNativeComponent` component as previously implemented in other components (for example, [Button][8]).

Relevant discussions facebook#30840 (comment) and https://github.com/facebook/react-native/pull/31001/files#r578827409.

[8]: https://github.com/facebook/react-native/pull/31001/files#diff-4f225d043edf4cf5b8288285b6a957e2187fc0242f240bde396e41c4c25e4124R281-R289

The solution proposed in this pull request consists of:
1. Passing `accessibilityState` to the `AndroidSwitchNativeComponent`
2. If the value of prop `accessibilityState.disabled` is different from the prop `disabled`, the prop `disabled` over-rides the `accessibilityState.disabled` value.

For example:
```jsx
<Switch disabled={true} accessibilityState={{disabled: false}} />
````
becomes:
````jsx
<Switch disabled={true} accessibilityState={{disabled: true}} />
````

## 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
-->

[General] [Fixed] - Switch Component doesn't disable click functionality when disabled

Pull Request resolved: facebook#33070

Test Plan:
[1]. Switch has `disabled` and `accessibilityState={{disabled: false}}`
[2]. Switch has `disabled`
[3]. Switch has `accessibilityState={{disabled: true}}`
[4]. Switch has `accessibilityState={{disabled:false}}`
[5]. Switch has `disabled={false}`  and `accessibilityState={{disabled:true}}`
7. Test Cases on the main branch
[7.1]. Switch has `disabled` and `accessibilityState={{disabled: false}}`
[7.3] Switch has `accessibilityState={{disabled: true}}`
[7.5] Switch has `disabled={false}`  and `accessibilityState={{disabled:true}}`

[1]: fabOnReact/react-native-notes#5 (comment)
[2]: fabOnReact/react-native-notes#5 (comment)
[3]: fabOnReact/react-native-notes#5 (comment)
[4]: fabOnReact/react-native-notes#5 (comment)
[5]: fabOnReact/react-native-notes#5 (comment)
[7.1]: fabOnReact/react-native-notes#5 (comment)
[7.3]: fabOnReact/react-native-notes#5 (comment)
[7.5]: fabOnReact/react-native-notes#5 (comment)

Reviewed By: kacieb

Differential Revision: D34189484

Pulled By: blavalla

fbshipit-source-id: 8ea9221a5641d05c20d0309abdb3f0d02c569f2f
@facebook facebook locked as resolved and limited conversation to collaborators Feb 16, 2023
@react-native-bot react-native-bot added the Resolution: Locked This issue was locked by the bot. label Feb 16, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees
No one assigned
Labels
Accessibility Component: Switch Good first issue Interested in collaborating? Take a stab at fixing one of these issues. Platform: Android Android applications. Resolution: Locked This issue was locked by the bot.
Projects
None yet
Milestone
No milestone
6 participants
@amarlette @fabOnReact @react-native-bot @mdaj06 @smash-96 @wertlop