Skip to content

Keyboard navigation doesn't work on navigation menus #2404

@octavpo

Description

@octavpo

Now that accessibility is becoming a requirement in public institutions in US, I'm trying to evaluate accessibility of our code. In particular I'm trying keyboard navigation in a menu that uses your Menu widget. The menu's structure is a 'ul' container of 'li' items, with an 'a' inside each 'li' linking to a different page.

If I only use a 'menu()' call on the 'ul' element, arrow navigation works fine, but nothing happens when I press 'return' or 'space'. If I add a handler for the 'select' event that triggers a 'click' on the 'a' element, it gets into a loop and I get a 'Uncaught InternalError: too much recursion'.

I thought I could avoid it by checking whether the 'ui.item[0]' is different from 'ui.item.prevObject[0]' before triggering the 'click' event, but they seem to always be the same.

So I'm out of options here, either I'm missing something or there's a bug somewhere. I'd say it should work without any customization, as this is a widespread pattern.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions