dequelabs / dequelabs/axe-core

label rule should only accept non-empty-placeholder with specifically allowed input types

Open
#4,795 0 comments 1 reaction 0 assignees View on GitHub
false negative
Dominant language
JavaScript
Stars
7.5k
Forks
933
Avg merge
2d 23h
Merged PRs (30d)
17

Description

### Product

axe-core

### Product Version

4.10.3

### Latest Version

- [x] I have tested the issue with the latest version of the product

### Summary

The `label` rule currently accepts the `non-empty-placeholder` check as being a valid means of providing an accessible name for any `input` or `textarea` element. However, both html-aam and actual browsers only support this for *some* types of input elements.

### Details

[html-aam section 4.1.1](https://www.w3.org/TR/html-aam-1.0/#input-type-text-input-type-password-input-type-number-input-type-search-input-type-tel-input-type-email-input-type-url-and-textarea-elements-accessible-name-computation) allows name-from-placeholder for:

> input type="text", input type="password", input type="number", input type="search", input type="tel", input type="email", input type="url" and textarea Elements

However, sections 4.1.2, 4.1.3, and 4.1.7 *do not* allow it for other input types besides those enumerated in 4.1.1. @JaiRai0304 verfied that at least for ``, browsers agree and do not treat the placeholder as the accessible name.

We should double check the browser behavior for other types of inputs to verify that there aren't any exciting cases where this technique is accessibility supported despite the spec.

#### Expectation

This form should trigger `label` violations:

```html

Select the preferred mode of communication


Email


Phone

```

#### Actual

No label violations.

#### How to Reproduce

see above

#### Additional context
n/a

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.