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

Leadership page modal links use invalid role #15538

Closed
alexgibson opened this issue Nov 21, 2024 · 0 comments
Closed

Leadership page modal links use invalid role #15538

alexgibson opened this issue Nov 21, 2024 · 0 comments
Assignees
@alexgibson
Labels
a11y Issues related to accessibility Bug 🐛 Something's not working the way it should

Comments

@alexgibson
Copy link
Member

alexgibson commented Nov 21, 2024 •
edited
Loading

Description

There's a small remaining a11y issue on the current /about/leadership page. We should not be using role="button" on a landmark like <article> content - instead it should just be a regular <div>. It seems OK that all descendants are declared as presentational when the role is applied, as only the person's name is read aloud which seems OK.

We should also add aria-controls and aria-expanded, to associate control with the modal element.

axe-core found 1 violation

# Description Axe rule ID WCAG Impact Count
1 ARIA role should be appropriate for the element aria-allowed-role Best practice minor 1

Failed

  1. ARIA role should be appropriate for the element

Learn more

aria-allowed-role

Best practice

Ensure role attribute has an appropriate value for the element

minor

Issue Tags: cat.aria best-practice

# Issue Description To solve this violation, you need to...
1 Element location

<br>#laura-chambers<br>

Element source

<br><article id="laura-chambers" class="vcard has-bio" itemscope="" itemtype="http://schema.org/Person" role="button" tabindex="0"><br>		 Fix any of the following:

* ARIA role button is not allowed for given element
@alexgibson alexgibson added Bug 🐛 Something's not working the way it should a11y Issues related to accessibility labels Nov 21, 2024
@alexgibson alexgibson self-assigned this Nov 21, 2024
alexgibson added a commit to alexgibson/bedrock that referenced this issue Nov 21, 2024
@alexgibson
Fix invalid role on /leadership modal links (fixes #mozilla#15538)
e82f516
alexgibson added a commit to alexgibson/bedrock that referenced this issue Nov 21, 2024
@alexgibson
Fix invalid role on /leadership modal links (fixes mozilla#15538)
314b64f
@alexgibson alexgibson mentioned this issue Nov 21, 2024
Merged
alexgibson added a commit to alexgibson/bedrock that referenced this issue Nov 21, 2024
@alexgibson
Fix invalid role on /leadership modal links (fixes mozilla#15538)
87ebba5
alexgibson added a commit to alexgibson/bedrock that referenced this issue Nov 26, 2024
@alexgibson
Fix invalid role on /leadership modal links (fixes mozilla#15538)
90fb016
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@alexgibson alexgibson

Labels
a11y Issues related to accessibility Bug 🐛 Something's not working the way it should
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
1 participant
@alexgibson