swagger-ui
swagger-ui copied to clipboard
a11y: Try It Out input/out should not be embedded in the Responses block
Q&A (please complete the following information)
- OS: [e.g. macOS] Windows 10
- Browser: [e.g. chrome, safari] Chrome
- Version: [e.g. 22] 121
- Method of installation: [e.g. npm, dist assets] npm
- Swagger-UI version: [e.g. 3.10.0] Swagger UI React 5.11.3
- Swagger/OpenAPI version: [e.g. Swagger 2.0, OpenAPI 3.0] OpenAPI 3.0
Content & configuration
Basic/ default
Describe the bug you're encountering
When you click Try it out and then click Execute, the curl command, the request URL, and the server response are embedded in the block that documents all command responses. This is non-intuitive and misleading for those using screen readers because what is displayed is not clearly labelled.
To reproduce...
Expand an API, expand a GET or POST command, click Try it out, click Execute. Observe the curl command, request URL, and server response are embedded in the block that documents all server responses.
Expected behavior
Try It Out input and output should be in its own panel beneath the Execute button with its own section header identifying it as the Execute request and response.
Screenshots
Here's the Execute request and response buried in the Responses section.