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

Add aria-label to progress bubble links #49476

Merged
merged 1 commit into from
Jan 5, 2023
Merged

Add aria-label to progress bubble links #49476

merged 1 commit into from
Jan 5, 2023

Conversation

rshipp
Copy link
Contributor

@rshipp rshipp commented Dec 13, 2022

The progress bubble BubbleLink component already has an a11y_description prop that's being exposed through a title attribute in the a tag. This works for some screenreaders (e.g. JAWS, NVDA), but not all of them (e.g. chrome screenreader extension). This PR adds the same text in an aria-label attribute, to support those missing screenreaders. I tested with JAWS and NVDA, and confirmed it does not read the label twice when this change is in place.

image

In this Javalab example (link in JIRA task), the descriptions look like "Level 2 Lesson Java Lab". They do not contain information about the completion status, so that information remains inaccessible since it's only represented by color. If we want to try adding that here too, I'm happy to do so.

Links

@rshipp rshipp requested a review from a team December 13, 2022 19:20
@rshipp rshipp merged commit e9293c9 into staging Jan 5, 2023
@rshipp rshipp deleted the a11y-17 branch January 5, 2023 19:44
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants