swagger-api / swagger-api/swagger-ui

Correct accessibility issues with dynamic content updates

Open
#10,707 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

backlog cat: a11y
Dominant language
JavaScript
Stars
29k
Forks
9.3k
Avg merge
2d 23h
Merged PRs (30d)
25

Description

Swagger UI has multiple buttons that dynamically change the content of the page. Users navigating the website with a screen reader might not know that anything changes, as there is no indication that it does, e.g.:

  • no indication that there are validation errors when authorizing or that the authorization was successful (note: there is also no visual indication that the fields have validation errors)

  • no indication that inputs become enabled when clicking on Try it out button

  • no indication that there are validation errors or that the request was successful after clicking on Execute button in Try it out

  • the fields with validation errors are not focused after clicking on Execute button

  • no indication what was copied or that it was successful when clicking on Copy to clipboard button

We could possibly address it with: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Guides/Live_regions

This task covers issues originally reported in:

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by reviewing the authorization, Try it out, Execute, and Copy to clipboard flows described in the issue, along with the linked MDN live-regions guidance. Done means screen-reader users receive feedback for validation errors, successful actions, enabled inputs, and copied content, with invalid fields focused after Execute.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
accessibility, frontend
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.