Comment 12 for bug 1828468

Revision history for this message
Stephanie Leary (stephanieleary) wrote :

Revised branch here: https://git.evergreen-ils.org/?p=working/Evergreen.git;a=shortlog;h=refs/heads/user/sleary/lp1828468-top-nav-revised

This is still Angular only, and uses the built-in Bootstrap dropdown keyboard functionality, which isn't entirely complete.

To recap what is and is not supported:

* You should be able to use the Tab key to move between the top-level menu items. The left/right arrow keys will not work here.
* Pressing Enter, Space, or the down arrow on a top-level item should open its submenu. Pressing Esc will close it. (Up arrow will not, which I find frustrating.)
* You can also shift-tab from the first submenu item back to the top level, and use Enter or Space to toggle the button again and close the submenu.
* Within the submenu, you can use either Tab and shift-Tab to move up and down, or the up/down arrow keys.
* Both buttons (e.g. Retrieve Last Bib Record) and links should be highlighted the same way.

We can add additional key events if we want, but we'll have to write them.

I had hoped to get the submenus marked up as unordered lists, which would add a little context for screen reader users, but I can't get the keyboard directives working when there are other elements in between the menu and the menu items. I'll file a bug with ng-Bootstrap about it.