-
Notifications
You must be signed in to change notification settings - Fork 338
Description
Description
The <input aria-labelledby="autocomplete-0-input" ..." element references the following element:
<label class="aa-Label" for="autocomplete-0-input" id="autocomplete-0-label"><button class="aa-SubmitButton" type="submit" title="Submit"><svg class="aa-SubmitIcon" viewBox="0 0 24 24" width="20" height="20" fill="currentColor"><path d="M16.041 15.856c-0.034 0.026-0.067 0.055-0.099 0.087s-0.060 0.064-0.087 0.099c-1.258 1.213-2.969 1.958-4.855 1.958-1.933 0-3.682-0.782-4.95-2.050s-2.050-3.017-2.050-4.95 0.782-3.682 2.050-4.95 3.017-2.050 4.95-2.050 3.682 0.782 4.95 2.050 2.050 3.017 2.050 4.95c0 1.886-0.745 3.597-1.959 4.856zM21.707 20.293l-3.675-3.675c1.231-1.54 1.968-3.493 1.968-5.618 0-2.485-1.008-4.736-2.636-6.364s-3.879-2.636-6.364-2.636-4.736 1.008-6.364 2.636-2.636 3.879-2.636 6.364 1.008 4.736 2.636 6.364 3.879 2.636 6.364 2.636c2.125 0 4.078-0.737 5.618-1.968l3.675 3.675c0.391 0.391 1.024 0.391 1.414 0s0.391-1.024 0-1.414z"></path></svg></button></label>
This element has only a <button> element with an SVG in it, and no title in the button.
The aria-labelledby docs state:
"Some elements get their accessible name from their inner content. For example, the accessible name for a , , or comes from the text between the opening and closing tags. Other elements, such as form <textarea>, , and get their accessible name from the content of associated elements; for these elements, the accessible name comes from the with a for attribute, , and caption respectively"
So it seems that even though the <button> element has a title attribute, the aria-labelledby expects the description to be inside the button element.
Reproduction
Use the WAVE Evaluation Tool Chrome Extension to test https://phelpsny.com/, and you'll see the errors here:
Expected behavior
I think the element would benefit from some invisible text that will be readable by screen readers.
Environment
- OS: macOS
- Browser: Chrome
- Autocomplete version: 1.11.0
