question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Placeholder does not get recognized as label

See original GitHub issue

Expectation: An <input> with a placeholder-attribute does not get recognized as having an accessible name

Actual: When I run aXe on FireFox at https://app.element.io/#, I get a violation on the search input. The input has a placeholder which should create an accessible name. Both FireFox and Chrome use this to create an accessible name, but aXe does not. <input type="text" class="mx_RoomSearch_input" placeholder="Search" autocomplete="off" value=""> aXe still gives the violation “Form elements must have labels”.

Motivation: It looks like a false positive.


axe-core version: 3.5.5
axe-webdriver, extension or other integration version: 4.5.3
Browser and Assistive Technology versions: FireFox 78.0.2

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Reactions:1
  • Comments:14 (8 by maintainers)

github_iconTop GitHub Comments

2reactions
WilcoFierscommented, Jul 28, 2020

Don’t agree with that label. This is a false positive.

2reactions
strakercommented, Jul 23, 2020

Thanks for the issue. Tested in Safari/VO, IE11/JAWS, and Firefox/NVDA and all use the placeholder for the accessible name. Also confirmed in the accessible name computation spec.

Read more comments on GitHub >

github_iconTop Results From Across the Web

HTML5 textarea placeholder not appearing - Stack Overflow
If you have an input in your form and placeholder is not showing because a white space at the beginning, this may be...
Read more >
I was shocked that placeholder text on an <input> (instead of ...
The HTML5 specification states The placeholder attribute should not be used as an alternative to a <label> . However, it is worth noting...
Read more >
Placeholder attribute and Why it is not accessible - Maxability
As the label is substituted with placeholder the user entered text only will be displayed in the field. When clear error identification ...
Read more >
Placeholder Attribute Is Not A Label! - Web Axe
Just so we're all clear on this, the HTML5 placeholder attribute in a text input is not a replacement for the label element....
Read more >
Don't Use The Placeholder Attribute - Smashing Magazine
The presence of a placeholder attribute won't be flagged by automated accessibility checking software. However, this doesn't necessarily ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found