swagger-api / swagger-api/swagger-ui
a11y: 'Schemes' label is not associated with its respective control
Nobody has claimed this yet.
- Dominant language
- JavaScript
- Stars
- 29k
- Forks
- 9.3k
- Avg merge
- 2d 23h
- Merged PRs (30d)
- 25
Description
Q&A (please complete the following information)
- OS: all
- Browser: all
Describe the bug you're encountering
Label 'Schemes' is not associated with its respective control i.e. 'http' dropdown button.
To reproduce...
Steps to reproduce the behavior:
- Open URL: https://petstore.swagger.io/
- Navigate on 'http' dropdown
- Press F12 to open the developer tool
- Verify that Label 'Schemes' should be associated with their respective form field or not.
Expected behavior
Label 'Schemes' should be associated with its respective control i.e. 'http' dropdown button. Screen Reader should announce it: 'Schemes Combobox http collapsed'.
Screenshots
Additional context or thoughts
In the absence of label information for form elements, then users' dependence with screen reader is not able to understand the purpose of UI component and could give-up to use the functionality.
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
Start at https://petstore.swagger.io/ and inspect the rendered 'Schemes' label and its 'http' dropdown with the browser developer tools. Verify the control's label association and test with a screen reader; done means it announces 'Schemes Combobox http collapsed'.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript
- Domain
- accessibility, frontend
- Issue type
- Bug
- Difficulty
- 2/5
- Estimated time
- 1-3 hours
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 45/100