This is a rough proposal for a content model for the menubar/menulist proposal (explainer).

In response to a content model violation, we are cribbing from #1099 and customizable select behavior:

• We'll still render the violating elements
• We'll emit devtools console messages warning the author
• If the content model is violated inside a menubar, we will give the menubar the ??? aria role
• If the content model is violated inside a menulist, we will give the menulist the dialog aria role

<menubar>

<menubar> represents an in-page group of <menuitem> elements.

• Allowed Descendants:
  • <menuitem>
• Forbidden: Any other element

<menulist>

<menulist> represents a native popover containing a list of <menuitem> elements.

• Allowed Descendants:
  • <menuitem>
  • <fieldset> (used for grouping checkable items)
  • <hr> (used as a separator)
• Forbidden: Any other element

<menuitem>

The <menuitem> element represents an individual command or submenu trigger.

• Allowed Descendants
  • <div>
  • phrasing content (e.g., text, <span>, <img>), provided it is not in the exclusion list below.
• Exclusion List
  • <datalist>
  • <object>
  • interactive content (e.g., <a>, <button>, <input>, <textarea>, <select>).
  • Any element with a tabindex attribute specified
  • Any element that is contenteditable
• Forbidden: Any other element

(Some) open questions:

1. What aria role do we use for a menubar with prohibited descendants?
2. Should we allow divs inside menubar and menulist to wrap menuitems?

We've started to write this content model at https://whatpr.org/html/12011/interactive-elements.html#the-menubar-element