-
-
Notifications
You must be signed in to change notification settings - Fork 3.2k
Description
Astro Info
Astro v5.17.2
Node v20.19.1
System Linux (x64)
Package Manager npm
Output static
Adapter none
Integrations none
If this issue only occurs in one browser, which browser is a problem?
No response
Describe the Bug
The Audit tool in the toolbar reports an accessibility issue, "Missing content" for anchors and headings in closed details elements unless the elements have aria-labels explicitly set, or the details element includes the open attribute. The issue persists upon manually opening the details element via clicking the summary.
This was replicated in StackBlitz on Node 20.19.1 but the same behavior occurs on my machine with Node 22.12.0 as required.
What's the expected result?
Since inner text is valid, I believe the audit should pass.
To my knowledge, accessibility is affected when elements have explicitly set display to none, visibility to hidden, or use the aria-hidden="true" attribute. The details element does none of these by default from what I can tell.
This might need better research - I'm not totally up to date with accessibility regarding detail/summary blocks. I couldn't find anything specific in the spec or on MDN.
Link to Minimal Reproducible Example
https://stackblitz.com/edit/withastro-astro-fp7kqxhx?file=src%2Fpages%2Findex.astro
Participation
- I am willing to submit a pull request for this issue.