fix: dismiss page-action dropdowns on outside click and Escape - #1
Closed
d0lim wants to merge 3 commits into
Closed
Conversation
The Export, Open in chat, and Connect to MCP actions are native <details> elements, which only close when their own summary is clicked again. Clicking anywhere else on the page left the floating panel hanging over the content. Close the open dropdown on any pointer press outside it, and on Escape (which also returns focus to the trigger). Both listeners are registered at module scope and query live, matching the existing resize handler, so client-router swaps don't stack duplicates.
Moves focus into the open panel before pressing Escape, so the new assertion proves the handler restored focus rather than just observing the click that opened the menu — asserting straight after the opening click passes either way.
Without the precondition, a focus() that silently failed would leave focus on the summary and the closing assertion would pass without Escape having restored anything.
Owner
Author
|
Origin PR is opened. haydenbleasel#214 |
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
1 participant
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.
Problem
The page-action dropdowns in the right-hand column — Export, Open in chat, and Connect to MCP — are native
<details>elements. A native<details>only closes when its own<summary>is clicked again, so clicking anywhere else on the page left the floating panel hanging over the content.Fix
Two listeners in
PageActions.astro:pointerdown— closes the open dropdown unless the press landed inside it, so clicking an item in the panel still works.keydown— Escape closes the open dropdown and returns focus to its trigger.Both are registered at module scope and query the DOM live, matching the existing
resizehandler's pattern, soastro:after-swapre-inits don't stack duplicate listeners.Testing
Added an e2e regression test in
apps/docs/e2e/site.e2e.ts. Confirmed it fails on the unfixed code (the panel stays open after the outside click) and passes with the fix.Also drove all three dropdowns manually via Playwright against
blume dev— each closes on an outside click and on Escape, and stays open when clicking an item inside it.bun run check,bun run typecheck, andbun run test:coverageall pass.