v143 · menu elements

A working menu bar

Three menus over a document, written as markup with no click handlers, no role attributes and no tabindex. What the page's own script does is listen for the commands the items send — which is a different job from making a menu work.

The application

File NewCtrl N Open…Ctrl O
SaveCtrl S Export (needs a document)
Edit UndoCtrl Z RedoCtrl Y
Clear the document
View Wide layout Narrow layout
An empty document. Choose something from the menus above.
Nothing has happened yet.

Commands received


    

Everything the page listens for is a command event on one element — the document. The menu items name what they want in their markup; nothing in the script knows that a menu exists, which is the point of routing through invoker commands rather than click handlers.

Trying it from the keyboard

Tab to File and press Enter or Space. Then try Escape to close, and the arrow keys to move between items and between menus.

Keyboard behaviour is the part of the proposal with the most open questions still in it, and the part an implementation lands last. If arrows do not move between items here, that is the browser's current state rather than the markup being wrong — the same markup is what will get the behaviour when it arrives.

see also