---
title: "Focusable element under aria-hidden (a11y/aria-hidden-focus)"
description: "Keyboard focus reaches an element screen readers can't see (Lighthouse: [aria-hidden] elements contain focusable descendants)."
url: http://localhost:4173/rules/a11y/aria-hidden-focus
updated: 2026-11-11
---

# Focusable element under aria-hidden

> `a11y/aria-hidden-focus` is a vetd rule. It flags: Focusable element under aria-hidden. It runs on every `check`, together with the TypeScript check.

| Fact | Value |
| --- | --- |
| Rule id | `a11y/aria-hidden-focus` |
| Severity | error |
| Group | Accessibility |
| Tags | accessibility, lighthouse |

## Why it matters

Keyboard focus reaches an element screen readers can't see (Lighthouse: [aria-hidden] elements contain focusable descendants).

## How to fix it

Add tabIndex={-1} to the focusable element, or remove aria-hidden.

## Credit

Based on work by:

- [Deque](https://www.deque.com): The axe rule aria-hidden-focus forbids focusable elements inside aria-hidden content.

## References

- [ARIA hidden element must not be focusable or contain focusable elements](https://dequeuniversity.com/rules/axe/4.10/aria-hidden-focus), Deque University
- [ARIA: aria-hidden attribute](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-hidden), MDN Web Docs
- [Understanding Success Criterion 4.1.2: Name, Role, Value](https://www.w3.org/WAI/WCAG22/Understanding/name-role-value.html), W3C

## Related rules

- [`a11y/tabindex-positive`](http://localhost:4173/rules/a11y/tabindex-positive.md)
- [`a11y/button-name`](http://localhost:4173/rules/a11y/button-name.md)

## Get this text from vetd

MCP: call `explain` with `{ "diagnosticId": "a11y/aria-hidden-focus" }`. CLI: `npx vetd explain a11y/aria-hidden-focus`.

---

[All 92 rules](http://localhost:4173/rules.md) · Previous: [`a11y/tabindex-positive`](http://localhost:4173/rules/a11y/tabindex-positive.md) · Next: [`a11y/iframe-title`](http://localhost:4173/rules/a11y/iframe-title.md)