missing-active-descendant
Web validation
aria-activedescendant must reference the id of an element that exists in the widget.Some composite widgets keep keyboard focus on a managing element, such as a role="listbox" or role="menu", and use aria-activedescendant to point to the option that is currently active.
If aria-activedescendant points to an id that does not exist, assistive technology can announce the wrong item or stop reporting changes. This often happens when the active item is removed or re-rendered but the reference is not updated. An empty value is allowed when no item is active, though tools may flag it for manual review.
Pass Patterns
Reference to an existing item
The aria-activedescendant value matches the id of an item inside the widget.
<div role="menu" tabindex="0" aria-activedescendant="menuitem_2">
<div role="menuitem" id="menuitem_1">Cut</div>
<div role="menuitem" id="menuitem_2">Copy</div>
<div role="menuitem" id="menuitem_3">Paste</div>
</div>Fail Patterns
Reference to an id that does not exist
The aria-activedescendant value points to an id that is not in the DOM.
<div role="menu" tabindex="0" aria-activedescendant="menuitem_4">
<div role="menuitem" id="menuitem_1">Cut</div>
<div role="menuitem" id="menuitem_2">Copy</div>
<div role="menuitem" id="menuitem_3">Paste</div>
</div>Stale reference after a re-render
The active option was removed or renamed, but the managing element still points to the old id.
<div role="listbox" tabindex="0" aria-activedescendant="opt_2">
<div role="option" id="opt_1">One</div>
<!-- opt_2 was removed when the list re-rendered -->
</div>WCAG techniques
Failure techniques
ACT Rules
Try It Yourself
Using a screen reader
New to screen reader testing, or need a refresher?
Review this article first: Practical guides for using screen readers
- Load the page and open a screen reader.
- Move focus to the composite widget that uses
aria-activedescendant. - Use the arrow keys to move between items.
Expected results: The screen reader announces the newly active item as you move.
Actual results: Announcements are missing, incorrect, or refer to an item that is not in the widget.
Inspecting the browser dev-tools
- Inspect the managing element and read its
aria-activedescendantvalue. - Search the DOM for an element with that
id. - Confirm the element exists and is inside the widget.
Expected results: An element with the referenced id exists within the widget.
Actual results: No element has that id, so the reference is broken.
FAQ
How does this issue relate to 1.3.1 Info and Relationships?
In an active-descendant widget, aria-activedescendant conveys the relationship between the managing element and the active item. When it references an id that does not exist, that relationship is no longer programmatically determinable, so assistive technology cannot reliably convey which item is active.
Why is this issue marked as Critical?
This pattern drives core keyboard interaction in composite widgets. When the active item reference breaks, assistive technology users can lose accurate context, and in some implementations the widget becomes difficult or impossible to operate.
Standards and Regulations
| Standard | Success Criterion | Reference |
|---|---|---|
| WCAG 2.2 | 1.3.1 Info and Relationships (A) | Information, structure, and relationships conveyed through presentation can be programmatically determined or are available in text. |
| EN 301 549 | 9.1.3.1 Info and Relationships | Same as the WCAG text. |