Skip to content

fix(scene-bar): keep scene tab close button under cursor on press - #2213

Open
linzhary wants to merge 3 commits into
GCWing:mainfrom
linzhary:fix/scene-tab-close-button-escape
Open

fix(scene-bar): keep scene tab close button under cursor on press#2213
linzhary wants to merge 3 commits into
GCWing:mainfrom
linzhary:fix/scene-tab-close-button-escape

Conversation

@linzhary

@linzhary linzhary commented Aug 11, 2026

Copy link
Copy Markdown

Summary

Fixes #2210 — the top SceneBar scene tab close button sometimes fails to close and instead activates the tab.

Root cause: the whole scene tab scales 0.985 around its center on :active (120ms). The close button is absolutely positioned (right: 6px) inside the tab, so the scale drags it left by 0.015 × (width/2 − 15)px (≈4–8px on typical scene tab widths). The mouseup hit-test then lands outside the button, the click bubbles to the tab, and the tab is activated instead of closed. The escape is larger on wider tabs and timing-sensitive (releasing during the 120ms scale misses more often).

Fix

  • SceneTab.tsx: measure the tab width and expose the close button's scale drift as --bitfun-scene-tab-close-shift.
  • SceneBar.scss: on :active, counter-translate the close button with the same 120ms cubic-bezier(0.23, 1, 0.32, 1) easing as the tab scale, so the press animation is fully preserved while the button stays under the cursor. The button is also pinned against the global motion baseline 1px drop on :active. :only-child and prefers-reduced-motion paths keep the button at its base position.

Verification

  • pnpm run type-check:web passes.
  • SCSS compiles cleanly.
  • Manual verification recommended: open 2+ scene tabs in desktop dev, press the close button at its right edge and release quickly — the button no longer shifts and the first click closes the tab.

Note: this PR is AI-assisted; testing level: lightly tested.

@GCWing
GCWing requested a review from kev1n77 August 11, 2026 06:28
The whole scene tab scales 0.985 around its center on :active (120ms), which drags the absolutely-positioned close button left by 0.015 x (width/2 - 15) px (~4-8px on typical scene tab widths). The mouseup hit-test then lands outside the button, so the click bubbles to the tab and activates it instead of closing it.

SceneTab now measures the drift and exposes it as --scene-tab-close-shift; SceneBar.scss counter-translates the close button with the same 120ms easing as the tab scale, so the press animation is preserved and the button stays under the cursor. The close button is also pinned against the global motion baseline 1px drop on :active. only-child and prefers-reduced-motion paths keep the button at its base position.

Verification: pnpm run type-check:web, sass compile; manual close-button verification in desktop dev.

Fixes GCWing#2210
The theme color audit contract keeps FALLBACK_VAR_CONTRACTS empty, so
var(--scene-tab-close-shift, 0px) was flagged as an uncontracted fallback
usage. Declare --scene-tab-close-shift: 0px on the tab as the default and
consume it without a fallback.
The appearance contract audit forbids the --scene-* CSS token family, so
--scene-tab-close-shift was rejected in both files. Use the component-scoped
name --bitfun-scene-tab-close-shift instead.
@linzhary
linzhary force-pushed the fix/scene-tab-close-button-escape branch from cee2327 to 566d461 Compare August 11, 2026 06:48
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.

[Bug]: 顶部标签页栏关闭按钮功能异常

1 participant