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(slide-toggle): input element should use switch role #15073

Merged

Conversation

devversion
Copy link
Member

@devversion devversion commented Feb 4, 2019

Based on the discussion in #14949 and the feedback from a Google a11y expert on
what role the underlying input of the slide-toggle should use, we now explicitly
specify the new switch role.

This is should improve accessibility because practically the slide-toggle
is neither always causing an immediately effective value change
(like a button), nor does its value only become effective on form
submission (like a role="checkbox)

Read more here: https://www.w3.org/TR/wai-aria-1.1/#switch. Similar to what mdc recommends.

Fixes #14949.

Based on the discussion in angular#14949
and the feedback from a Google a11y expert on what role the underlying
input of the `slide-toggle` should use, we now explicitly specify the
new `switch` role.

This is should improve accessibility because practically the `slide-toggle`
is neither always causing an immediately effective value change
(like a `button`), nor does its value only become effective on form
submission (like a `role="checkbox`)

Read more here: https://www.w3.org/TR/wai-aria-1.1/#switch

Fixes angular#14949.
@devversion devversion added Accessibility This issue is related to accessibility (a11y) target: patch This PR is targeted for the next patch release labels Feb 4, 2019
@googlebot googlebot added the cla: yes PR author has agreed to Google's Contributor License Agreement label Feb 4, 2019
@jelbourn
Copy link
Member

jelbourn commented Feb 4, 2019

Which screenreaders did you test this with?

@devversion
Copy link
Member Author

@jelbourn I've tested it on VoiceOver: Safari and Chrome, and Narrator: Edge.

Everything worked as expected. Just a small difference was that Narrator said toggle switch while VoiceOver just said switch. It's definitely a good improvement because previously it just considered it as a checkbox and now it says on/off instead of checked/unchecked.

Copy link
Member

@jelbourn jelbourn left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

@jelbourn jelbourn added pr: lgtm action: merge The PR is ready for merge by the caretaker labels Feb 4, 2019
Set aria-checked attribute for ARIA spec compliance
@jelbourn jelbourn merged commit 01dcf7e into angular:master Feb 5, 2019
jelbourn pushed a commit that referenced this pull request Feb 11, 2019

Verified

This commit was created on GitHub.com and signed with GitHub’s verified signature. The key has expired.
Based on the discussion in #14949
and the feedback from a Google a11y expert on what role the underlying
input of the `slide-toggle` should use, we now explicitly specify the
new `switch` role.

This is should improve accessibility because practically the `slide-toggle`
is neither always causing an immediately effective value change
(like a `button`), nor does its value only become effective on form
submission (like a `role="checkbox`)

Read more here: https://www.w3.org/TR/wai-aria-1.1/#switch

Fixes #14949.
@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Sep 10, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
Accessibility This issue is related to accessibility (a11y) action: merge The PR is ready for merge by the caretaker cla: yes PR author has agreed to Google's Contributor License Agreement target: patch This PR is targeted for the next patch release
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Slide-toggle should use role="switch"
3 participants