ariaActiveDescendantTabIndex

Reports elements with aria-activedescendant without tabIndex.

✅ This rule is included in the jsx logical preset.

aria-activedescendant is used to manage focus within a composite widget. Elements with this attribute should be tabbable, either through an inherent tabIndex (like <input>) or an explicit tabIndex attribute.

Without proper tabIndex, keyboard users cannot reach the element to interact with it.

Examples

❌ Incorrect

<div aria-activedescendant={someID} />

<span aria-activedescendant="item-1" />

✅ Correct

<div aria-activedescendant={someID} tabIndex={0} />

<div aria-activedescendant={someID} tabIndex={-1} />

<input aria-activedescendant={someID} />

<button aria-activedescendant={someID} />

When Not To Use It

If you’re not using aria-activedescendant or have a custom focus management system, you can disable this rule.

Further Reading

• MDN: Using the aria-activedescendant attribute
• WAI-ARIA: Composite Widgets

Equivalents in Other Linters

• ESLint: jsx-a11y/aria-activedescendant-has-tabindex
• Oxlint: jsx_a11y/aria-activedescendant-has-tabindex