Linter Rule: No `aria-hidden` on `<body>`

Rule: html-no-aria-hidden-on-body

Description

Prevent usage of aria-hidden on <body> tags.

Rationale

The aria-hidden attribute should never be present on the <body> element, as it hides the entire document from assistive technology users. This makes the entire page completely inaccessible to screen reader users, which is a critical accessibility violation.

Examples

✅ Good

erb

<body>
  <main>Content</main>
</body>

<body class="app" id="main">
  <main>Content</main>
</body>

🚫 Bad

erb

<body aria-hidden>The `aria-hidden` attribute should never be present on the `<body>` element, as it hides the entire document from assistive technology users. (html-no-aria-hidden-on-body)
  <main>Content</main>
</body>

<body aria-hidden="true">The `aria-hidden` attribute should never be present on the `<body>` element, as it hides the entire document from assistive technology users. (html-no-aria-hidden-on-body)
  <main>Content</main>
</body>

References

Using the aria-hidden attribute
How Lighthouse identifies hidden body elements
WCAG 4.1.2 - Name, Role, Value (Level A)
ember-template-lint: no-aria-hidden-body

Linter Rule: No aria-hidden on <body> ​

Description ​

Rationale ​

Examples ​

✅ Good ​

🚫 Bad ​

References ​