Back to Learn
Pulseaccessibility

ARIA Tooltip Elements Have Accessible Names

What This Audit Checks

This audit verifies that elements with role="tooltip" have an accessible name. Tooltips provide supplementary descriptions and must be identifiable by assistive technologies.

Why It Matters

A tooltip without a name cannot be referenced by aria-describedby in a meaningful way. Screen reader users miss the supplementary context the tooltip was designed to provide.

How to Fix It

  • Add text content to the tooltip element. The text content becomes the accessible name automatically.
  • Use aria-label if the tooltip contains non-text content like icons.
  • Connect the tooltip to its trigger using aria-describedby.
<!-- Bad: empty tooltip -->
<div role="tooltip" id="tip-1"></div>

<!-- Good: tooltip with text content -->
<button aria-describedby="tip-1">Save</button>
<div role="tooltip" id="tip-1">Save your changes to disk</div>

How Pulse Tracks This

Pulse flags this audit in your Lighthouse accessibility score. When the audit fails, Pulse shows which elements triggered it so you can fix them directly.

Resources