# Element “label” is missing one or more of the following attributes: “aria-checked”, “aria-level”, “role”.

> Canonical HTML version: https://rocketvalidator.com/html-validation/element-label-is-missing-one-or-more-of-the-following-attributes-aria-checked-aria-level-role
> Attribution: Rocket Validator (https://rocketvalidator.com)
> License: CC BY 4.0 (https://creativecommons.org/licenses/by/4.0/)

A `<label>` can't carry `aria-expanded` unless it also has a `role`, and the validator reports this message when it finds one that doesn't.

`aria-expanded` tells assistive technologies whether a control's collapsible content, such as an accordion panel or a menu, is open or closed. ARIA allows it only on interactive roles like `button`, `combobox`, `link` or `tab`. A `<label>` has no ARIA role of its own, since its only job is to name a form control. The message lists three attributes, but only `role` clears it. Add `aria-checked` or `aria-level` and the validator asks for `role` instead.

The message usually comes from an accordion whose clickable header is a `<label>`, often with `aria-controls` pointing at the panel and a script that toggles it. Keyboard users can't reach that header, because a `<label>` doesn't take focus, and screen readers don't announce it as something to press. Make the header a `<button type="button">` and move `aria-expanded` and `aria-controls` onto it. If the section has a title, put the button inside a heading. A `<button>` has no `for` attribute, so drop it. For a simple disclosure that needs no script, `<details>` and `<summary>` track the open state without any ARIA.

Adding `role="button"` and `tabindex="0"` to the `<label>` also clears the message. You then have to handle the Enter and Space keys in script, though, and a `<label>` linked to a form control keeps forwarding its clicks to that control. That link causes a second error too: the validator reports that `aria-expanded` and `aria-controls` must not be used on a `<label>` associated with a form control. A `<label>` that wraps its control gets a similar message about a label that is an ancestor of a labelable element.

## Invalid example

```html
<label id="shipping-header" aria-expanded="false" aria-controls="shipping-panel">
  Shipping
</label>
<div id="shipping-panel" role="region" aria-labelledby="shipping-header" hidden>
  <p>Orders ship within two business days.</p>
</div>
```

## Valid example

```html
<h2>
  <button type="button" id="shipping-header" aria-expanded="false" aria-controls="shipping-panel">
    Shipping
  </button>
</h2>
<div id="shipping-panel" role="region" aria-labelledby="shipping-header" hidden>
  <p>Orders ship within two business days.</p>
</div>
```
