Back to home

Testing aria-haspopup

aria-haspopup indicates that an element triggers a popup, and identifies what kind: menu, listbox, tree, grid, or dialog. true is treated as an alias for menu.

aria-haspopup was deprecated as a Global attribute in ARIA 1.2, meaning it is no longer intended for use on arbitrary elements. It remains fully valid as a Widget attribute, used on interactive controls like the button below.

Example: aria-haspopup="menu", interactive

This is a menu button. Unlike the combobox on the aria-activedescendant page, where focus deliberately stayed on the input the whole time, this pattern moves real keyboard focus into the menu itself. Activate the button, or press Arrow Down while it is focused, to open the menu.

Expected result: "Actions" should be announced as having a popup menu. When the menu opens, focus should genuinely move to the first menu item, not stay on the button, this is real focus movement, not the virtual focus pattern used by aria-activedescendant.

HTML markup 
<button
  aria-haspopup="menu"
  aria-expanded="false"
  aria-controls="action-menu"
>
  Actions
</button>
<ul role="menu" id="action-menu" aria-labelledby="menu-button">
  <li role="menuitem" tabindex="-1">Edit</li>
  <li role="menuitem" tabindex="-1">Duplicate</li>
  <li role="menuitem" tabindex="-1">Delete</li>
</ul>

Other values, reference

The remaining values are demonstrated in full on their own pages elsewhere on this site, rather than rebuilt here.

aria-haspopup values
Value Popup type See
menu (or true) A menu of commands Above
listbox A list of selectable suggestions, typically in a combobox aria-activedescendant page
dialog A modal or non-modal dialog Modal testing pages
tree A hierarchical tree of items Not demonstrated on this site, a genuinely rare pattern in most day-to-day work
grid A grid-structured popup, such as a date picker Not demonstrated on this site

Note for testing: confirm with your standard browser and screen reader combinations that "has popup" is announced correctly for the menu button above, and that the popup type is conveyed accurately, not just "has popup" generically.

Back to home