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.

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

fix(toggle): properly announce toggle as switch with a label on screen readers #22477

Merged
merged 53 commits into from Nov 12, 2020

Conversation

brandyscarney
Copy link
Member

@brandyscarney brandyscarney commented Nov 11, 2020

Dev build: 5.5.0-dev.202011111928.7c95d89

⚠️ Depends on #22402 ⚠️

fixes #21646 references #21552

Added a switch from the example here: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/Switch_role

Found our Toggle behaves the same way in macOS and iOS Safari, see the following:

Screen Shot 2020-11-12 at 12 30 56 PM
Screen Shot 2020-11-12 at 12 31 59 PM

brandyscarney and others added 30 commits October 19, 2020 15:58
- don't announce checkbox as being inside of another checkbox
- properly announce when checked
- expand footprint so the selected box surrounds the label too
@github-actions github-actions bot added the package: core @ionic/core package label Nov 11, 2020
@brandyscarney brandyscarney changed the title fix(toggle): follow a11y guidelines fix(toggle): properly announce toggle as switch with a label on screen readers Nov 11, 2020
@kensodemann
Copy link
Member

Testing on my iPad, this announces toggle as checkbox
On Android, though, it does announce it as a switch.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
package: core @ionic/core package
Projects
None yet
Development

Successfully merging this pull request may close these issues.

bug: labels are not read for ion-toggle
2 participants