jsonforms icon indicating copy to clipboard operation
jsonforms copied to clipboard

Orphaned labels on single select dropdown

Open sgober opened this issue 2 years ago • 2 comments

Describe the bug

When testing for 508 compliance, I noticed that the single select dropdown renderers have orphaned labels. The htmlFor on the label is for example "#/properties/92-input" but the id on the input is "#/properties/92", thus the label is orphaned and it shows up that the input has no label.

Expected behavior

Label should be correctly associated with the single select dropdown.

Steps to reproduce the issue

I use the wave chrome extension to see what 508 compliance errors there are, so all you need to do is have a single select in your schema and you can see that the label and input are not associated

Screenshots

Wave output example (red is missing input label error and orange is orphaned label warning): Screenshot 2023-10-25 at 10 45 49 AM

Output example where for and id don't match: Screenshot 2023-10-25 at 10 45 24 AM

In which browser are you experiencing the issue?

Google Chrome 118.0.5993.117

Which Version of JSON Forms are you using?

v3.0.0

Framework

React

RendererSet

Material

Additional context

No response

sgober avatar Oct 25 '23 14:10 sgober

Hi @sgober,

Thanks for the report! Would you like to contribute a fix?

sdirix avatar Oct 26 '23 09:10 sdirix

PR here: https://github.com/eclipsesource/jsonforms/pull/2199

sgober avatar Oct 26 '23 14:10 sgober

Was fixed with 3.2

sdirix avatar Mar 27 '24 10:03 sdirix