require input elements to have a label (input-missing-label)

Labels are associated with the input element and is required for a17y.

Rule details

Examples of incorrect code for this rule:

<!-- no label element at all -->
<div>
    <strong>My field</strong>
    <input type="text">
</div>

<!-- unassociated label -->
<div>
    <label>My field</label>
    <input type="text">
</div>
error: Input element does not have a label (input-missing-label) at inline:4:6:
  2 | <div>
  3 |     <strong>My field</strong>
> 4 |     <input type="text">
    |      ^^^^^
  5 | </div>
  6 | 
  7 | <!-- unassociated label -->


error: Input element does not have a label (input-missing-label) at inline:10:6:
   8 | <div>
   9 |     <label>My field</label>
> 10 |     <input type="text">
     |      ^^^^^
  11 | </div>


2 errors found.

Examples of correct code for this rule:

<!-- label with descendant -->
<div>
    <label>My field <input type="text"></label>
</div>

<!-- associated label -->
<div>
    <label for="my-field">My field</label>
    <input id="my-field" type="text">
</div>