Skip to content

Expandable nav items in the left sidebar are not keyboard accessible #12116

@glin

Description

@glin

Bug description

This is a similar issue to #10284 (comment)

The expandable nav items in the left sidebar are not keyboard or screen reader accessible because they use anchor tags without href attributes. I found a related open issue about expandable nav items that could cover this issue, at #4935. But I think a quick fix here could help a lot before taking the more complicated changes from #4935

As an alternative to an empty href="", I have seen some sites also just link to the first page in the list. For example, in a MkDocs Material site: https://docs.posit.co/rspm/2024.11.0/admin/. The Getting Started expandable item doubles as a link to the Requirements page. Once you're on the Requirements page, the Getting Started expandable item switches back to a expand/collapse button only.

Steps to reproduce

  1. Navigate to https://quarto.org/docs/guide/
  2. Press the Tab key until you reach the Guide link on the left sidebar
  3. Press the Tab key again

Actual behavior

  • Keyboard focus will skip the Authoring, Computations, Tools, Documents, Presentations expandable items and go straight to the Dashboards link

Expected behavior

  • Users should be able to navigate to expandable nav items using a keyboard
    • Then expand the nav item with the Enter button (already seems to work)

Your environment

No response

Quarto check output

(Using the Quarto website for testing), but the local version we have is Quarto 1.6.39

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions