Skip to content

fix: update collapse button aria-label and aria-expanded on toggle - #62

Merged
JacobCoffee merged 3 commits into
mainfrom
fix/collapse-button-label
Oct 11, 2026
Merged

JacobCoffee merged 3 commits into
mainfrom
fix/collapse-button-label

Conversation

@JacobCoffee

Copy link
Copy Markdown
Owner

The toolbar collapse button's screen-reader label never changed when the toolbar was collapsed or expanded, and the stale label persisted even after a collapsed state was restored from localStorage on page load.

What was wrong: the button always announced "Collapse toolbar" with aria-expanded="true", regardless of the toolbar's actual collapsed state.

What changed: added updateCollapseButton() in src/debug_toolbar/core/assets.py that syncs the button's title, aria-label ("Collapse toolbar" / "Expand toolbar"), and aria-expanded with the current state. It's called once on init (to handle a collapsed state restored from storage) and again on every toggle().

How verified:

  • Added a regression test in tests/integration/test_litestar_middleware.py (TestCollapseButtonAccessibility) checking the initial markup and that the served JS contains the fix; confirmed it fails on the pre-fix JS and passes after.
  • make ci passes in the worktree.
  • Manually verified in a real browser against examples/litestar_basic: initial state, after collapsing, after expanding, and after reloading while collapsed all show the correct aria-label/aria-expanded.

The toolbar collapse button's aria-label and aria-expanded attributes
never changed when the toolbar was collapsed or expanded, including
when a collapsed state was restored from localStorage on page load.
The button always announced "Collapse toolbar" with aria-expanded
"true" regardless of actual state.

Add updateCollapseButton() to sync the label, title, and
aria-expanded attribute with the current collapsed state, called on
init and on every toggle.
Copilot AI balanced review requested due to automatic review settings October 11, 2026 00:28

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Copilot was unable to review this pull request because the user who requested the review has reached their quota limit.

@github-actions

github-actions Bot commented Oct 11, 2026 •

Copy link
Copy Markdown
Contributor
PR Preview Action v1.8.1

QR code for preview link

🚀 View preview at
https://JacobCoffee.github.io/debug-toolbar/pr-preview/pr-62/

Built to branch gh-pages at 2026-10-11 01:05 UTC.
Preview will be ready when the GitHub Pages deployment is complete.

Copilot AI balanced review requested due to automatic review settings October 11, 2026 00:33

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Copilot was unable to review this pull request because the user who requested the review has reached their quota limit.

@JacobCoffee
JacobCoffee enabled auto-merge (squash) October 11, 2026 00:35
Copilot AI balanced review requested due to automatic review settings October 11, 2026 01:04

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Copilot was unable to review this pull request because the user who requested the review has reached their quota limit.

@JacobCoffee
JacobCoffee merged commit 0f0a657 into main Oct 11, 2026
24 checks passed
@JacobCoffee
JacobCoffee deleted the fix/collapse-button-label branch October 11, 2026 01:09
@JacobCoffee JacobCoffee mentioned this pull request Oct 11, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants