Skip to content

a11y-label-has-associated-control: Check if for attribute of label matches the id attribute of the control. #6515

Closed
@yamanoku

Description

@yamanoku

Describe the problem

a11y-label-has-associated-control rule checks if a label has a for attribute.
However, the current situation is that even if for="", the validation check passes.
(since it only checks if the label has a for attribute)

if (!attribute_map.has('for') && !has_input_child) {

Worse, even if there is a mismatch between for and id, it is still considered OK.

<label for="hoge">label</label>
<input type="text" id="fuga" />

https://svelte.dev/repl/43799b2d7f004a039c634db91a94efda?version=3

Describe the proposed solution

I think the for attribute of a label should not only be added, but it should also be matched with the corresponding control's id attribute.

I would like the validation to be such that if the id attribute of the corresponding control and the for attribute of the label match, then there is no problem, like this

<!-- bad -->
<label for="hoge">label</label>
<input type="text" id="fuga" />

<!-- good -->
<label for="hoge">label</label>
<input type="text" id="hoge" />

Alternatives considered

N/A

Importance

would make my life easier

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions