jquery / jquery/jquery-ui

Accordions violate accessibility requirements of WCAG 2.1

Open
#2,403 1 comment 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Needs info
Dominant language
JavaScript
Stars
11.3k
Forks
5.2k
PR merge metrics
No merged PRs in 30d

Description

When I run a scan with axe-core DevTools on a page containing an accordion made with your widget, I get a critical error indicating that for the element with a 'tablist' role "Element has children which are not allowed: [role=tabpanel]". The ARIA Authoring Practices Guide (APG) examples at https://www.w3.org/WAI/ARIA/apg/patterns/accordion/examples/accordion/ seems to show accordions shouldn't use tab roles at all.

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the accordion widget and compare its ARIA roles with the W3C ARIA Authoring Practices Guide accordion example. Reproduce the issue by scanning a page containing an accordion with axe-core DevTools, then verify that the scan no longer reports the tablist/tabpanel violation.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, jquery
Domain
accessibility, frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Quiet
Clarity
Mostly clear
Newbie friendliness
48/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.