[menu] Consider reusing `<menu>` and `<nav>` HTML elements

[domfarolino]

trafficstars

Instead of introducing a brand new elements like <menubar> element, we could consider reusing <menu> for the regular, non-navigation menubar example referenced by ARIA's authoring practices: https://www.w3.org/WAI/ARIA/apg/patterns/menubar/examples/menubar-editor/. This would need to be done with some sort of opt-in (much like appearance: base-select does for the existing <select> element, to make it customizable), which could either be in CSS or an HTML attribute. We could also maybe consider reusing <nav> for the navigation bar use case, but this is related to https://github.com/openui/open-ui/issues/1193.

It seems nice to reuse these elements if possible, just because they have nice short names and we'd be adding less new clutter to the platform, but I think there are tradeoffs, and discussing this with WHATWG folks will be important as time passes.

[lukewarlow]

Does it actually need any opt in?

Can't it just be that its role is menu when it contains a new menuitem element? Likewise deal with rendering changes based on this too menu:has(menuitem)?

Also I think we'd be using menu instead of a new menulist rather than it being lieu of menubar right?

---

Based on the fact menuitem did actually exist as an element at one point (I was only aware of menu), my above comment won't work.

[aardrian]

Understand that the APG menu pattern is aspirational. APG was created only to show idealized ARIA-only patterns (which were grounded in Microsoft Windows behaviors and interaction methods). That big warning box at the top of the page is both a signal not to use them as-is and also the best I could get them to add once people treated these like a specification or best practice. APG should not be used as the basis for new elements.

Instead I suggest looking at:

• the ARIA menu role;
• the ARIA menuitem role;
• related ARIA menu roles;
• the Core AAM mappings for each (all 5);
• the HTML AAM for <menu>;
• the obsoleted <menuitem> element;
• the obsoleted type attribute on <menu>;
• and for those last two in particular, dig up everything you can on why they were obsoleted (because if you can't address those reasons then you can save yourself a bunch of time on this effort).

[github-actions[bot]]

There hasn't been any discussion on this issue for a while, so we're marking it as stale. If you choose to kick off the discussion again, we'll remove the 'stale' label.