aria icon indicating copy to clipboard operation
aria copied to clipboard

Clarify Accessibility Parent-Child Relationships for menu, group, and menuitem

Open giacomo-petri opened this issue 8 months ago • 3 comments

Closes #2438

The current specifications for menu and menubar contradict those for menuitem, menuitemcheckbox, and menuitemradio.

Specifically, the following structure is allowed under the menu role but not when considering the menuitem role:

<div role="menu">
	<div role="group">
		<span role="menuitem">Item 1</span>
		<div role="group">
			<span role="menuitem">Item 2</span>
			<span role="menuitem">Item 3</span>
		</div>
	</div>
</div>

This PR clarifies that this structure is indeed allowed.

Additionally, it explicitly clarifies in a note that the following example, where a group contains a button and an input as accessibility children, is not permitted. This prevents ambiguity by making it clear that having at least one menuitem as an accessibility child of the group does not justify including other unrelated elements, which was not clearly stated.

<div role="menu">
	<div role="group">
		<span role="menuitem">Item 1</span>
		<div role="group">
			<span role="menuitem">Item 2</span>
			<span role="menuitem">Item 3</span>
		</div>
		<button>Test</button>
		<input type="text aria-label="Test">
	</div>
</div>

This update refines the specifications for menu, menubar, menuitem, menuitemcheckbox, and menuitemradio roles consistently.


Test, Documentation and Implementation tracking

Once this PR has been reviewed and has consensus from the working group, tests should be written and issues should be opened on browsers. Add N/A and check when not applicable.

  • [ ] "author MUST" tests:
  • [ ] "user agent MUST" tests:
  • [ ] Browser implementations (link to issue or commit):
    • WebKit:
    • Gecko:
    • Blink:
  • [ ] Does this need AT implementations?
  • [ ] Related APG Issue/PR:
  • [ ] MDN Issue/PR:

Preview | Diff

giacomo-petri avatar Mar 21 '25 14:03 giacomo-petri

Deploy Preview for wai-aria ready!

Name Link
Latest commit 7048eb6295e6438239fc9d8ead70a3205214b133
Latest deploy log https://app.netlify.com/projects/wai-aria/deploys/6894db20b48ac70008cbe264
Deploy Preview https://deploy-preview-2483--wai-aria.netlify.app
Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

netlify[bot] avatar Mar 21 '25 14:03 netlify[bot]

@np-at to review as well!

spectranaut avatar Mar 27 '25 17:03 spectranaut

actually, taking myself off as a reviewer since we have so many others.

scottaohara avatar Mar 27 '25 17:03 scottaohara

@pkra, I just realized the same issue affects tree/group/treeitem structures. Should we include this change in this PR or create a separate one?

giacomo-petri avatar Apr 03 '25 09:04 giacomo-petri

@giacomo-petri sounds good. Hopefully it's simpler since #2094 prevents group as child of tree.

pkra avatar Apr 03 '25 10:04 pkra

Discussed in today's meeting: https://www.w3.org/2025/07/03-aria-minutes.html#3a9f

spectranaut avatar Jul 03 '25 17:07 spectranaut

@spectranaut, I agree that we likely need a definition for "intervening," but it's already used 7 times in the specs, though always referring to generic or none. That said, I think the current wording for group doesn't add complexity and still aligns with the intent of the others, even if the context and outcome differ. Should we consider trying adding that definition (since it also impacts generic intervening) in a separate PR?

giacomo-petri avatar Aug 07 '25 16:08 giacomo-petri

I'm not sure why my last review is marked "requesting changes" - I'm guessing the suggested change is to blame.

I don't oppose merging this as is, despite remaining somewhat unhappy with the language.

pkra avatar Aug 27 '25 08:08 pkra