WIP: ARIA issue with Checkbox form fields

Browser: Any
OS: Any
URL: –
Video: –

Added a form with a Checkbox field as shown in the screenshot.

The emitted code adds an attribute aria-labelledby=“label-58653a” but this ID doesn’t exist because there’s no common field label with that ID, just labels for the options without an ID attribute.

Note: I’ve NOT toggled “Add element ID as needed” in Bricks settings, so IDs should be always added.

1 Like

Oh, and the defined Label is not shown, by the way :wink:

Hi Matthias,
Thanks so much for your report!

Enabling the “Show labels” toggle should fix both of your issues.

Best regards,
timmse

1 Like

Thank you! Stupid me…

However, the aria-labelledby attribute should not be emitted if the target (label) doesn’t exist.

If you clear the label field, it won’t be emitted :slight_smile:

That’s true. But in this case, the field is listed as something like “Field (4)” in the builder. :frowning:

For other field types, with “Show Labels” disabled, like Text field, there’s no aria-labelledby attribute. That should be handled the same for Checkbox fields.
Better have no aria-labelledby attribute than an invalid one.

That’s a minor drawback. We’ll see if we can improve that. Theoretically, we could always output the aria-label, provided that a value (label) is available. If “show labels” is enabled, we switch to “aria-labelledby”. In my opinion, that would be the most sensible solution, or am I overlooking something?

Exactly. You should only emit the aria-labelledby if the referenced label is really available.

For other fields that seems to be the correct behavior, but for Checkbox, it’s currently not:
The aria-labelledby is always emitted no matter if the label is shown or not.

1 Like