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

fix(snack-bar): announcing same message twice to screen readers #13298

Merged
merged 1 commit into from
Dec 12, 2018
Merged

fix(snack-bar): announcing same message twice to screen readers #13298

merged 1 commit into from
Dec 12, 2018

Conversation

crisbeto
Copy link
Member

Currently we have role="alert" on the snack bar which will cause screen readers to announce the message automatically. On top of it, we also use the LiveAnnouncer to announce the same message, if the consumer hasn't set one. These changes clear the announcementMessage if it's the same as the main message.

@crisbeto crisbeto added Accessibility This issue is related to accessibility (a11y) target: patch This PR is targeted for the next patch release labels Sep 24, 2018
@googlebot googlebot added the cla: yes PR author has agreed to Google's Contributor License Agreement label Sep 24, 2018
@jelbourn
Copy link
Member

cc @josephperrott

Shouldn't we always use the LiveAnnouncer and remove role="alert"? My understanding was that the announcementMessage replaced the actual content of the message for announcement purposes

@crisbeto
Copy link
Member Author

@jelbourn if we were to remove the role="alert", content inside snackbars that are opened from a component or a TemplateRef won't be read out automatically. Given that it's the only way of using markup inside the snack bar, it may end up breaking some apps.

jelbourn
jelbourn approved these changes Sep 26, 2018
View reviewed changes
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.

Right, I remember now. In that case LGTM

@jelbourn jelbourn added pr: lgtm action: merge The PR is ready for merge by the caretaker labels Sep 26, 2018
@crisbeto
fix(snack-bar): announcing same message twice to screen readers
9b34639 
Currently we have `role="alert"` on the snack bar which will cause screen readers to announce the message automatically. On top of it, we also use the `LiveAnnouncer` to announce the same message, if the consumer hasn't set one. These changes clear the `announcementMessage` if it's the same as the main message.
@crisbeto crisbeto force-pushed the snack-bar-multi-announcement branch from ecca4ac to 9b34639 Compare November 13, 2018 21:09
@vivian-hu-zz vivian-hu-zz merged commit 3fb4b23 into angular:master Dec 12, 2018
vivian-hu-zz added a commit that referenced this pull request Dec 12, 2018
@vivian-hu-zz
Revert "fix(snack-bar): announcing same message twice to screen reade…
039dd7d 
…rs (#13298)"

This reverts commit 3fb4b23.
@vivian-hu-zz vivian-hu-zz mentioned this pull request Dec 12, 2018
Merged
vivian-hu-zz added a commit that referenced this pull request Dec 13, 2018
@vivian-hu-zz
Revert "fix(snack-bar): announcing same message twice to screen reade…
e9466a4 
…rs" (#14494)

* Revert "build: update nodejs bazel rules (#14466)"

This reverts commit a3fef46.

* Revert "docs(form-field): native select reset values not working in examples (#14236)"

This reverts commit 97f52c0.

* Revert "fix(menu): allow text wrapping in menu items (#11430)"

This reverts commit 3661abe.

* Revert "fix(dialog,bottom-sheet): invert backdrop color on dark themes (#13065)"

This reverts commit fe96f38.

* Revert "build: replace deprecated tslint rule with compiler option (#13186)"

This reverts commit 5dfa45f.

* Revert "fix(snack-bar): announcing same message twice to screen readers (#13298)"

This reverts commit 3fb4b23.
@crisbeto crisbeto mentioned this pull request Dec 13, 2018
Merged
vivian-hu-zz added a commit that referenced this pull request Dec 13, 2018
@vivian-hu-zz
Revert "fix(snack-bar): announcing same message twice to screen reade…
c9b30af 
…rs (#13298)"

This reverts commit 3fb4b23.
vivian-hu-zz added a commit that referenced this pull request Dec 13, 2018
@vivian-hu-zz
Revert "fix(autocomplete): auto-highlighted first option not display …
4d42a90 
…correctly if the floating label is disabled" (#14505)

* Revert "Revert "fix(snack-bar): announcing same message twice to screen readers" (#14494)"

This reverts commit e9466a4.

* Revert "Revert "fix(dialog,bottom-sheet): invert backdrop color on dark themes" (#14492)"

This reverts commit 3eb7e9c.

* Revert "Revert "fix(menu): allow text wrapping in menu items" (#14493)"

This reverts commit a3da8d2.

* Revert "build: update nodejs bazel rules (#14466)"

This reverts commit a3fef46.

* Revert "docs(form-field): native select reset values not working in examples (#14236)"

This reverts commit 97f52c0.

* Revert "fix(menu): allow text wrapping in menu items (#11430)"

This reverts commit 3661abe.

* Revert "fix(dialog,bottom-sheet): invert backdrop color on dark themes (#13065)"

This reverts commit fe96f38.

* Revert "build: replace deprecated tslint rule with compiler option (#13186)"

This reverts commit 5dfa45f.

* Revert "fix(snack-bar): announcing same message twice to screen readers (#13298)"

This reverts commit 3fb4b23.

* Revert "feat(drag-drop): allow entire group of drop lists to be disabled (#14179)"

This reverts commit 94e76de.

* Revert "fix(drag-drop): prevent text selection while dragging on Safari (#14405)"

This reverts commit 220e388.

* Revert "fix(autocomplete): auto-highlighted first option not display correctly if the floating label is disabled (#14414)"

This reverts commit 53d2b58.
josephperrott pushed a commit to josephperrott/components that referenced this pull request Jan 14, 2019
@crisbeto @josephperrott
fix(snack-bar): announcing same message twice to screen readers (angu…
1ef0f5e 
…lar#13298)

Currently we have `role="alert"` on the snack bar which will cause screen readers to announce the message automatically. On top of it, we also use the `LiveAnnouncer` to announce the same message, if the consumer hasn't set one. These changes clear the `announcementMessage` if it's the same as the main message.
josephperrott pushed a commit to josephperrott/components that referenced this pull request Jan 14, 2019
@vivian-hu-zz @josephperrott
Revert "fix(snack-bar): announcing same message twice to screen reade…
ec2d2de 
…rs" (angular#14494)

* Revert "build: update nodejs bazel rules (angular#14466)"

This reverts commit a3fef46.

* Revert "docs(form-field): native select reset values not working in examples (angular#14236)"

This reverts commit 97f52c0.

* Revert "fix(menu): allow text wrapping in menu items (angular#11430)"

This reverts commit 3661abe.

* Revert "fix(dialog,bottom-sheet): invert backdrop color on dark themes (angular#13065)"

This reverts commit fe96f38.

* Revert "build: replace deprecated tslint rule with compiler option (angular#13186)"

This reverts commit 5dfa45f.

* Revert "fix(snack-bar): announcing same message twice to screen readers (angular#13298)"

This reverts commit 3fb4b23.
josephperrott pushed a commit to josephperrott/components that referenced this pull request Jan 14, 2019
@vivian-hu-zz @josephperrott
Revert "fix(autocomplete): auto-highlighted first option not display …
a7074af 
…correctly if the floating label is disabled" (angular#14505)

* Revert "Revert "fix(snack-bar): announcing same message twice to screen readers" (angular#14494)"

This reverts commit e9466a4.

* Revert "Revert "fix(dialog,bottom-sheet): invert backdrop color on dark themes" (angular#14492)"

This reverts commit 3eb7e9c.

* Revert "Revert "fix(menu): allow text wrapping in menu items" (angular#14493)"

This reverts commit a3da8d2.

* Revert "build: update nodejs bazel rules (angular#14466)"

This reverts commit a3fef46.

* Revert "docs(form-field): native select reset values not working in examples (angular#14236)"

This reverts commit 97f52c0.

* Revert "fix(menu): allow text wrapping in menu items (angular#11430)"

This reverts commit 3661abe.

* Revert "fix(dialog,bottom-sheet): invert backdrop color on dark themes (angular#13065)"

This reverts commit fe96f38.

* Revert "build: replace deprecated tslint rule with compiler option (angular#13186)"

This reverts commit 5dfa45f.

* Revert "fix(snack-bar): announcing same message twice to screen readers (angular#13298)"

This reverts commit 3fb4b23.

* Revert "feat(drag-drop): allow entire group of drop lists to be disabled (angular#14179)"

This reverts commit 94e76de.

* Revert "fix(drag-drop): prevent text selection while dragging on Safari (angular#14405)"

This reverts commit 220e388.

* Revert "fix(autocomplete): auto-highlighted first option not display correctly if the floating label is disabled (angular#14414)"

This reverts commit 53d2b58.
@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.
Reviewers

@josephperrott josephperrott josephperrott approved these changes

@jelbourn jelbourn jelbourn approved these changes

Assignees

@jelbourn jelbourn

@josephperrott josephperrott

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
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
5 participants
@crisbeto @jelbourn @josephperrott @googlebot @vivian-hu-zz