Describe the bug
Several interactive elements throughout the Redoc UI are not fully accessible for keyboard-only users or users utilizing assistive technologies (like screen readers). Specifically:
- JSON Viewer Collapsers: These buttons do not announce their expanded/collapsed state via
aria-expanded, and they lack descriptive dynamic aria-labels. Previously, they also couldn't be toggled via keyboard (Enter/Space).
- Search Box Clear Button (
×): The clear icon is not focusable (tabIndex={0} is missing) and lacks keyboard interaction or an accessible role="button".
- SelectOnClick Wrapper (
Select all text): The clickable wrapper is not focusable via keyboard, has no accessible description/role, and cannot be activated via keyboard.
- Search Result List: Lacks semantic grouping structure (like
role="menu" or role="listbox") and has no dynamic aria-label informing screen reader users of how many search results were returned.
Expected behavior
- Interactive elements should have
tabIndex={0} and appropriate semantic ARIA roles (e.g. role="button" or role="menu").
- Interactive states (like expanding/collapsing nodes in the JSON Viewer) should dynamically announce updates using
aria-expanded="true/false" and descriptive aria-labels.
- All elements click-toggled by mouse should also be activated via
Enter or Space keys.
- The search input results should announce results count dynamically (e.g. via
aria-live or proper labeling).
Minimal reproducible OpenAPI snippet (if possible)
Any OpenAPI spec containing JSON schema examples or a search box (e.g. the standard Petstore OpenAPI spec) displays these missing accessibility tags in the generated HTML.
Screenshots
(N/A - Structural HTML/A11y markup issue. You can inspect the DOM in the DevTools console to see the elements before the changes)
Additional context
Improving accessibility ensures compliance with modern web standard guidelines (WCAG 2.1 AA) and makes Redoc documentation usable for a wider range of users, including those relying on screen readers or keyboard navigation.
Describe the bug
Several interactive elements throughout the Redoc UI are not fully accessible for keyboard-only users or users utilizing assistive technologies (like screen readers). Specifically:
aria-expanded, and they lack descriptive dynamicaria-labels. Previously, they also couldn't be toggled via keyboard (Enter/Space).×): The clear icon is not focusable (tabIndex={0}is missing) and lacks keyboard interaction or an accessiblerole="button".Select all text): The clickable wrapper is not focusable via keyboard, has no accessible description/role, and cannot be activated via keyboard.role="menu"orrole="listbox") and has no dynamicaria-labelinforming screen reader users of how many search results were returned.Expected behavior
tabIndex={0}and appropriate semantic ARIA roles (e.g.role="button"orrole="menu").aria-expanded="true/false"and descriptivearia-labels.EnterorSpacekeys.aria-liveor proper labeling).Minimal reproducible OpenAPI snippet (if possible)
Any OpenAPI spec containing JSON schema examples or a search box (e.g. the standard Petstore OpenAPI spec) displays these missing accessibility tags in the generated HTML.
Screenshots
(N/A - Structural HTML/A11y markup issue. You can inspect the DOM in the DevTools console to see the elements before the changes)
Additional context
Improving accessibility ensures compliance with modern web standard guidelines (WCAG 2.1 AA) and makes Redoc documentation usable for a wider range of users, including those relying on screen readers or keyboard navigation.