menu/menubar should be allowed to be empty

[smhigley]

Related to #383 and #1444

This is a very similar issue to the ones about aria-required-children on list, listbox, and tree. I can't think of a reason why menu and menubar should not be allowed to be empty as well. Two scenarios where this might happen include:

• A menu's commands are loaded dynamically when it is opened, and it does not contain menuitems when in the loading state
• There is a way to filter commands in a menu, and the user types in a string that does not match any menuitems. (This is the scenario where I'm currently running into the issue)

I generally think the aria-required-children rule makes more sense as an allowed children check across all roles where it applies, as @WilcoFiers mentioned in this comment: https://github.com/dequelabs/axe-core/issues/1444#issuecomment-476868942. The comment further down notes that only menu, menubar, and row would continue to fail when empty. I understand row, but I couldn't find any reason stated in that thread why menu/menubar would require children, and I can't personally think of a reason why those would be exceptions.

This is related to the ARIA changes in #1454, but I don't think updating menu/menubar to match list, listbox, tree, etc. would need to wait on the ARIA PR (speaking of which, going to go update that now... :D)

[WilcoFiers]

Hey Sarah. Yeah I think in theory menus could be empty. Do you have any real-world example of this though? My reading of WAI-ARIA is that menus must contain at least one menuitem, or be set to aria-busy.

[smhigley]

@WilcoFiers the specific use case that I ran into was with a menu that allows users to search/filter menuitems, and fails when a search string didn't match anything:

[WilcoFiers]

Fair enough! I'll see what we can do. You may also want to raise this with ARIA as well, since this doesn't seem valid as per Required owned elements:

https://www.w3.org/TR/wai-aria-1.2/#mustContain 5.2.6 Required Owned Elements Any element that will be owned by the element with this role. For example, an element with the role list will own at least one element with the role listitem.

When multiple roles are specified as required owned elements for a role, at least one instance of one required owned element is expected. This specification does not require an instance of each of the listed owned roles. For example, a menu should have at least one instance of a menuitem, menuitemcheckbox, or menuitemradio. The menu role does not require one instance of each.

[smhigley]

Thanks!

And yup, This prompted me to finally go back and update my allowed-children PR (https://github.com/w3c/aria/pull/1454). That should fix this on the ARIA spec side of things 😄.

[padmavemulapati]

Validated with the latest axe-core develop branch code base, aria-required-children allowing menu and menubar to be empty. test sript:

 <div role="menu" id="incomplete10"></div>
<div role="menubar" id="incomplete11"></div>
<div role="list" id="fail4">
  <div role="tabpanel" id="ignore6">
    <div role="listitem" id="ignore7">List item 1</div>
  </div>
</div>
<div role="row" id="fail5">
  <span>Item 1</span>
</div>
  <div role="row" id="target"></div>