Media: Fix ARIA labelling and list semantics in the media views - #13368
Media: Fix ARIA labelling and list semantics in the media views#13368itzmekhokan wants to merge 1 commit into
Conversation
The media modal labelled itself with a fixed `media-frame-title` ID that was set on the frame's heading container. In the Media Library grid that ID is claimed by the manage frame's empty heading, so the Edit attachment dialog had no accessible name, and any page that opened more than one media frame ended up with duplicate IDs. Generate the ID on the modal instance, set it directly on the frame's H1 heading, and reference it from the dialog element. Also set `role="group"` on the attachments list. Its `li` children carry `role="checkbox"`, and ARIA in HTML only allows that if the role of the list itself is changed as well. Fixes #66025.
|
The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the Core Committers: Use this line as a base for the props when committing in SVN: To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook. |
Test using WordPress PlaygroundThe changes in this pull request can previewed and tested using a WordPress Playground instance. WordPress Playground is an experimental project that creates a full WordPress instance entirely within the browser. Some things to be aware of
For more details about these limitations and more, check out the Limitations page in the WordPress Playground documentation. |
1 participant
The Edit attachment modal in the Media Library grid opens without an accessible name, and the attachments list is reported as structurally invalid because its items override the list-item role.
tmpl-media-modallabeled itsrole="dialog"element with a fixedmedia-frame-titleID that sat on the frame's heading container. In the grid that ID belongs to the manage frame's empty heading, and any page opening more than one media frame produces duplicates. The ID is now generated per modal instance and set on the frame'sh1. Separately, the attachmentsulgetsrole="group", since itslichildren carryrole="checkbox"and ARIA in HTML only permits that when the list role changes too.Trac ticket: https://core.trac.wordpress.org/ticket/66025
Use of AI Tools
AI assistance: Yes
Tool(s): Claude Code
Model(s): Claude Opus 5
Used for: reproducing the violations in the browser, diagnosing the duplicate ID, and drafting the fix. All changes were reviewed and validated by me.
This Pull Request is for code review only. Please keep all other discussion in the Trac ticket. Do not merge this Pull Request. See GitHub Pull Requests for Code Review in the Core Handbook for more details.