fix(sidebar): expose the active nav destination to assistive tech - #6448
Merged
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Accessibility gap in the sidebar's destination list (Home / Reports / Tasks / Library, plus coding-agent rows): the active item is only marked via a
data-activeattribute used for CSS styling — nothing tells assistive tech which destination is currently selected.Why it matters: a screen-reader user navigating this list has no way to tell which destination (or coding agent) is currently open; sighted users get this for free from the active-state styling.
Fix: add
aria-current="page"on the activeSidebarMenuButton, mirroringitem.isActive(already computed for both destinations and coding-agent rows, sincerow()is shared).SidebarMenuButton(packages/ui) spreads unknown props onto the underlying element, so no change to the shared component was needed.To confirm: open the sidebar, select a destination, and inspect the corresponding
<button>— it now carriesaria-current="page"; inactive rows have noaria-currentattribute.Checks run locally:
bun run fmt,bunx tsc --noEmit(apps/web, clean),bunx oxlint apps/web/src/components/sidebar/nav-destinations.tsx(0 warnings/errors). No existing test covers this file (it's hook-heavy, not pure logic) — full CI validates the rest.Summary by cubic
Marks the active sidebar destination with aria-current="page" so screen readers can announce the current page. Previously only a data-active attribute indicated the active item; now the active button exposes its state without changing visuals.
SidebarMenuButton;packages/uialready forwards unknown props, so no shared UI change.Written for commit 4250a8a. Summary will update on new commits.