-
Notifications
You must be signed in to change notification settings - Fork 1
Description
Steps to recreate
On the lux-design-system page for the LuxLibraryFooter run the Wave evaluation tool extension (more on evaluation tools). There is one error where a form does not have a corresponding label.
This seems to be part of the email form, but maybe
This finding was found while doing an audit of the Allsearch Frontend, and is also present on the Catalog.
URL
https://webaim.org/standards/wcag/checklist#sc2.4.6
Issues
1.1.1 Non-text Content (Level A)
1.3.1 Info and Relationships (Level A)
2.4.6 Headings and Labels (Level AA)
3.3.2 Labels or Instructions (Level A)
Severity
WCAG Success Criterion
- Form buttons have a descriptive value
- Inputs have associated accessible names
- Text labels are associated with form inputs. Related form controls are grouped with fieldset/legend. ARIA labelling may be used when standard HTML is insufficient.
WCAG Conformance level (A, AA, AAA)
A, AA
User impact
Users may not be able to recognize or interact with the form.
Recommended fix
If a text label for a form control is visible, use the element to associate it with its respective form control. If there is no visible label, either provide an associated label, add a descriptive title attribute to the form control, or reference the label(s) using aria-labelledby. Labels are not required for image, submit, reset, button, or hidden form controls.
Acceptance criteria
- I can successfully use this feature with Voice Over in Safari.
- I have checked this feature using one of the following browser extensions and confirmed that it does not add any level A or level AA issues:
- axe dev tools
- Lighthouse
- Wave
- ...
Notes
Looking at the code, it's possible this is a honeypot for bots?
<input data-v-102d5e24="" type="text" name="b_f1159e2c2a8bc35d62147f282_6c19fe9a37" tabindex="-1" value="" data-np-intersection-state="visible">