Skip to content

Conversation

@mturoci
Copy link
Contributor

@mturoci mturoci commented Oct 4, 2022

Pre-flight checklist

  • I have read the Contributing Guidelines on pull requests.
  • If this is a code change: I have written unit tests and/or added dogfooding pages to fully verify the new behavior.
  • If this is a new API or substantial change: the PR has an accompanying issue (closes #0000) and the maintainers have approved on my working plan.

Motivation

Added aria-live attribute that indicates the element will be updated in future. This effectively solves issue as the original aria-label is read on every button submission, compared to be read just once as before.

Test Plan

Manual testing using VoiceOver screen reader on MacOS.

Test links

Deploy preview: https://deploy-preview-8174--docusaurus-2.netlify.app/

Related issues/PRs

Closes #7667

@facebook-github-bot facebook-github-bot added the CLA Signed Signed Facebook CLA label Oct 4, 2022
@mturoci mturoci changed the title fix: Announce theme switches when using screen reader. #7667 fix(theme): announce theme switches when using screen reader. #7667 Oct 4, 2022
@netlify
Copy link

netlify bot commented Oct 5, 2022

[V2]

Name Link
🔨 Latest commit
🔍 Latest deploy log https://app.netlify.com/sites/docusaurus-2/deploys/633db14acaee251138527892
😎 Deploy Preview https://deploy-preview-8174--docusaurus-2.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site settings.

@netlify
Copy link

netlify bot commented Oct 5, 2022

[V2]

Name Link
🔨 Latest commit a6e976f
🔍 Latest deploy log https://app.netlify.com/sites/docusaurus-2/deploys/633db233f5faed000874992c
😎 Deploy Preview https://deploy-preview-8174--docusaurus-2.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site settings.

@slorber
Copy link
Collaborator

slorber commented Oct 5, 2022

Hey

Just learned VoiceOver 101 to test this 😄

What I understand is that before the aria-label would be read again but not on space / enter, but only when pressing voiceover ctrl+opt+space

After this change it announce the chance with both space / enter / ctrl+opt+space so it looks better to me 👍

Also reading aria-live docs, that seems like an appropriate usage to me 👍

Thanks

@slorber slorber merged commit 44af538 into facebook:main Oct 5, 2022
@slorber slorber added pr: bug fix This PR fixes a bug in a past release. to backport This PR is planned to be backported to a stable version of Docusaurus labels Oct 5, 2022
@github-actions
Copy link

github-actions bot commented Oct 5, 2022

⚡️ Lighthouse report for the deploy preview of this PR

URL Performance Accessibility Best Practices SEO PWA Report
/ 🟠 60 🟢 98 🟢 100 🟢 100 🟠 80 Report
/docs/installation 🟠 71 🟢 100 🟢 100 🟢 100 🟢 90 Report

@Josh-Cena Josh-Cena changed the title fix(theme): announce theme switches when using screen reader. #7667 fix(theme): announce theme switches Oct 5, 2022
@slorber
Copy link
Collaborator

slorber commented Oct 12, 2022

I think there's a remaining issue so re-opened there: #7667 (comment)

slorber added a commit that referenced this pull request Oct 28, 2022
@slorber slorber added backported This PR has been backported to a stable version of Docusaurus and removed to backport This PR is planned to be backported to a stable version of Docusaurus labels Nov 2, 2022
@slorber slorber mentioned this pull request Jan 25, 2023
3 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

backported This PR has been backported to a stable version of Docusaurus CLA Signed Signed Facebook CLA pr: bug fix This PR fixes a bug in a past release.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

a11y: light & dark mode checkbox doesn't announce state switches

3 participants