Form-Associated Custom Elements are not Associated to Labels about axe-core

[break-stuff]

After doing some digging, it looks like in Safari it is a bug on their end. The element is not properly referencing the label.

[straker]

Thanks for the issue. I'm not sure the ElementInternals are working correctly for screen readers. Here's how different screen readers and browsers read the input when focused:

• VoiceOver / Safari - "Edit text, blank"
• JAWS / Chrome - "My Input, edit, type of text"
• NVDA / Firefox - "Edit has autocomplete, blank"

Checking the internals.labels property and the label is indeed associated with the element according to the API, but it appears that screen readers haven't caught up to this approach yet. As such I think it is correct that axe-core fails these.

[break-stuff]

Oh, interesting. VoiceOver on Chrome and Firefox are working for me - "Edit text, blank, My Input, group".
MS Narrator also appears to read it.

[break-stuff]

I went ahead and filed bugs for both NVDA and Apple about the above issues.

[WilcoFiers]

I think we're going to need to figure out a way to detect this and report a separate issue for it. Missing for labels is a big problem, I wouldn't want to pass this, but it would be useful if we explicitly stated this technique isn't broadly supported yet.

[mrazzari]

Oh, interesting. VoiceOver on Chrome and Firefox are working for me - "Edit text, blank, My Input, group". MS Narrator also appears to read it.

The VO + Chrome implementation isn't great either.

• The "group" in your test is a smell. Only actual groups, like a fieldset, should be announced as groups.
• Using arrow navigation (VO + Right Arrow) each field results in 3 stops:
  1. My input, group.
  2. Text edit, empty.
  3. End of, My input, group
  • Compare with a regular form field which is just 1 stop: My input, text edit.
• If we disable grouping then the control name is not announced when using arrow navigation.

Other tests:

• Narrator + Chrome: no label announced.
• Narrator + Edge: like VO, announces the label OK, but also "group".

Seems like major red flags on poor or inconsistent support for this feature.