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(material/dialog): dialog name on mac only using aria-label #29264

Draft
wants to merge 3 commits into
base: main
Choose a base branch
from

Conversation

essjay05
Copy link
Contributor

Fixes bug with Angular Components Dialog component on Mac whether using Chrome or Firefox the screenreader does not read the dialog name/title unless it is using an aria-label. Updates the dialog-content-directives to read/apply the aria- labelledby and aria-describedby values if they exist.

Fixes b/274674581

@jelbourn jelbourn added the dev-app preview When applied, previews of the dev-app are deployed to Firebase label Jun 14, 2024
Copy link

github-actions bot commented Jun 14, 2024

Deployed dev-app for 4d12a2a to: https://ng-dev-previews-comp--pr-angular-components-29264-dev-rjpcttjr.web.app

Note: As new commits are pushed to this pull request, this link is updated after the preview is rebuilt.

@essjay05 essjay05 force-pushed the dialog-name-title-fix branch 3 times, most recently from eafae8b to 85ba74d Compare June 21, 2024 00:26
Fixes bug with Angular Components Dialog component on Mac
whether using Chrome or Firefox the screenreader does not
read the dialog name/title unless it is using an aria-label.
Updates the dialog-content-directives to read/apply the aria-
labelledby and aria-describedby values if they exist.

Fixes b/274674581
Fixes issue with Angular Components Dialog component where VoiceOver
does not read the dialog name if the dialog is supposed to be read by
aria-labelledby or aria-describedby attributes. Updates dialog-container.ts
so that the aria-labelledby or aria-described by value (if any) is used
as an aria-label value.

Fixes b/274674581
Fixes Angular Components Dialog component where the dialog name is
not read by VoiceOver/screenreader on macOS chrome & firefox
browsers. Attempts to retrieve any id associated with aria-labelledby
or aria-describedby and taking the innerHTML or the aria-label of that
element and applying that value to the dialog's aria-label.

Fixes b/274674581
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
dev-app preview When applied, previews of the dev-app are deployed to Firebase
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants