a11y: Try it Out request body params are not accessible

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 configuration

Describe the bug you're encountering

We are using Sort Site to evaluate our site for accessibility. When we expand a POST method pane and click Try it out, Sort Site flags this error: "HTML form control has no accessible name. A label (or name) linked to the control allows screen readers to voice the label correctly when reading the control. To add a label do one of the following:

• use a "label" element with the "for" attribute set to the ID of the form control
• wrap a "label" element around the form control
• add a "title" attribute
• add an "aria-label" attribute
• add an "aria-labelledby" attribute.

Violates WCAG 2.0 A F68 https://www.w3.org/TR/WCAG20-TECHS/F68.html

To reproduce...

Click to expand a POST call then click Try it out. This is in the user-entry "request boy" section, in textarea with class "body-param__text" contained in div "body-param"

Expected behavior

No accessibility error :)

Screenshots

Here's our content:

Additional context or thoughts

Here's the Sort Site error and solution

Search the Swagger UI source for the body-param__text textarea inside the body-param request-body section. Inspect how the control is rendered after clicking Try it out, then ensure it has an accessible name and verify that the reported accessibility error no longer occurs.