Accessibility: cannot tab to arrow buttons on small view
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 25.9k
- Forks
- 2.4k
- Avg merge
- 13h 10m
- Merged PRs (30d)
- 4
Description
Describe the bug
Repro steps:
- Go to redocly demo
- Shrink browser window until arrow button appears
- Tab through page
Expected behavior
The up/down arrow buttons are focusable.
Actual behavior
The up/down arrow buttons are not focusable.
Additional context
I filed a keyboard accessibility issue before (#2283) - let me know if I should combine all accessibility issues I found.
Is there already a way to configure these buttons to be accessible?
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Reproduce the issue in the Redocly demo by shrinking the browser until the up/down arrows appear, then tab through the page. Locate the implementation of those small-view arrow buttons and make them reachable by keyboard focus. Done means both buttons receive focus during normal tab navigation and the behavior is verified against the reported steps.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react, typescript
- Domain
- accessibility, frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100