Skip to content

ControlSurface: position dropdown popover from the measured trigger - #80

Open
ptn wants to merge 1 commit into
sKuhLight:mainfrom
ptn:fix/dropdown-menu-offset
Open

ControlSurface: position dropdown popover from the measured trigger#80
ptn wants to merge 1 commit into
sKuhLight:mainfrom
ptn:fix/dropdown-menu-offset

Conversation

@ptn

@ptn ptn commented Aug 23, 2026

Copy link
Copy Markdown

Summary

  • The select-field dropdown was positioned using grid-cell math ((w.y + w.h) * step), assuming the trigger sits flush against its grid cell's bottom edge.
  • .card centers its content and a select field is shorter than the knob-sized cell it lives in, so the menu opened well below the visible trigger instead of right under it.
  • Now measures the trigger's own getBoundingClientRect() on open instead of deriving position from grid math.

Test plan

  • Added a Playwright regression test (e2e/17-device-layout.spec.ts) asserting the popover sits within 10px of the trigger's actual bottom edge and aligns horizontally — verified it fails (~50px gap) against the old code and passes against the fix
  • npm run test (vitest, 1111 tests) passes
  • Manually verified in local dev

🤖 Generated with Claude Code

The select-field popover was positioned using grid-cell math
((w.y + w.h) * step), but .card centers its content and a select
field is shorter than the knob-sized cell it lives in — so the menu
opened well below the visible trigger instead of right under it.
Measure the trigger's own getBoundingClientRect() on open instead.

Adds a Playwright regression test asserting the menu sits within
10px of the trigger's actual bottom edge.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_0174T2D9oi9m9ww761Nn4wss
@ptn

ptn commented Aug 23, 2026

Copy link
Copy Markdown
Author

Before:

Screenshot 2026-08-23 at 6 14 24 PM

After:

Screenshot 2026-08-23 at 6 14 55 PM

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.

1 participant