Skip to content

[Menu]: a11y: ui5-menu popover exposes role="dialog" (aria-modal) instead of role="menu", inconsistent with an aria-haspopup="menu" opener #14219

Open

Description

@mastanshaikk

Describe the bug

When a trigger button declares aria-haspopup="menu" and opens a ui5-menu, the opened popup is not exposed as a menu. ui5-menu renders its items in a ResponsivePopover whose inner section is role="dialog" with aria-modal="true", wrapping the role="menu" list. A screen reader therefore announces a "menu button" on the opener but encounters a dialog containing the menu — an inconsistent popup semantic (WCAG 4.1.2 Name, Role, Value; 1.3.1).

A consumer cannot fix this from outside the component: the ResponsivePopover lives in ui5-menu's shadow DOM, ui5-menu exposes no prop to change the popover role, and the PopupAccessibleRole enum only offers None | Dialog | AlertDialog (no Menu).

Root cause (source)

  • Popup.accessibleRole defaults to "Dialog" — packages/main/src/Popup.ts:178 — which drives the section role="dialog" (_role) and aria-modal="true" (_ariaModal).
  • MenuTemplate.tsx wraps List accessibleRole="Menu" in a ResponsivePopover without setting accessibleRole, so the menu's popover inherits the "Dialog" default.

Isolated example

Any Button with aria-haspopup="menu" as the opener of a ui5-menu with a couple of ui5-menu-items. Inspect the accessibility tree with the menu open.

Expected behaviour

The opened popup's role matches the opener's aria-haspopup="menu" — i.e. the only popup role exposed is the List's role="menu" with its role="menuitem" children; no competing role="dialog" / aria-modal wrapper.

Actual behaviour

Accessibility tree (desktop):

dialog "Select an option from the menu"  (aria-modal="true")   <-- ResponsivePopover section
  menu
    menuitem "..."
    menuitem "..."

Suggested fix

Have ui5-menu set its internal ResponsivePopover accessibleRole="None" (which makes _role and _ariaModal undefined) so the List's role="menu" is the sole exposed popup semantic. Popover focus management is handled by the focus-trap spans, so keyboard behaviour is unaffected.

Context

Found while verifying an SAP SuccessFactors accessibility defect: Approve/Decline "menu buttons" on the Home page open ui5-menu; aria-expanded toggles and role="menu"/role="menuitem" are present, but the popover wrapper is role="dialog". Related prior items: #9313 (Menu popover treated as a dialog, accessible name added), #6810 / #6090 (requests to allow a menu role on Popover).

UI5 Web Components version

2.x (reproduced on current main)

Activity

  1. GDamyanov commented on Oct 28, 2026

    @GDamyanov
    Contributor

    Hello @UI5/ui5-team-ctr-bal,

    Could you check this incident?

    Thanks & Kind Regards,
    Georgi

  2. self-assigned this
    on Oct 29, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

Labels

Type

No type

Projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions