Created by: FluffyPorkBuns
Made it so a menubar with nested dropdowns will be keyboard accessible according to W3's menubar design pattern: https://www.w3.org/TR/wai-aria-practices/examples/menubar/menubar-1/menubar-1.html
- Top-level dropdowns can be navigated through with the left and right arrows or tab keys.
- Top-level dropdowns are opened with spacebar, down arrow, or enter key. First item in dropdown is selected automatically.
- Dropdowns can be navigated with up and down arrows or tab key and selection wraps from beginning to end / end to beginning.
- Sub-dropdowns can be opened with right arrow, spacebar, or enter key. First item in sub-dropdown is selected automatically.
- Dropdowns and sub-dropdowns can be closed with the left arrow or escape key. Only the currently open dropdown or sub-dropdown will close (will not bubble up to all parents and close everything). The item that opened that dropdown is selected automatically.
- Dropdown and sub-dropdown links can be opened with spacebar or enter key and closes entire menubar.
- Only one dropdown can be open at a time in a menubar.
- Fixed a bug where the spacebar didn't open dropdown items (dropdown.js line 39).
I'm guessing my changes may not fit the existing code gracefully (this was created for a specific menubar for a project and I'm not that familiar with this codebase) but I'm interested in hearing what others think about adding these accessibility features to the existing dropdown code.