[BUG] [v1.1.0] Auxiliary header minimize button: imperative hover styles bypass Solid style reconciliation

[tubel-hi]

Project

ide

Description

The minimize control uses style={buttonStyle} (static background: "transparent") plus onMouseEnter / onMouseLeave that assign e.currentTarget.style.background directly. That bypasses Solid’s normal style updates. If the sidebar is closed or the tree re-renders from another path while the pointer is still over the button, mouseleave may not run, and the DOM can keep an imperative hover background that no longer matches component state.

Error Message

Debug Logs

System Information

OS: Ubuntu
Context: Bounty Challenge v1.1.0

Screenshots

6.webm

Steps to Reproduce

Open the auxiliary sidebar with a view so the header (minimize + close) is visible.
Hover the minimize button so the hover background applies.
Close/hide the secondary sidebar with a keyboard shortcut (or any path that does not move the mouse and may not deliver mouseleave to that button).

Expected Behavior

Button visuals follow Solid/reactive styling and reset correctly when the sidebar closes or state changes.

Actual Behavior

Imperatively set background can outlive the intended state because it is not driven by the same reactive style object and may persist across re-renders if onMouseLeave does not run.

Additional Context

No response

[hinzwilliam52-ship-it]

/attempt #39583

[willkhinz]

/attempt #39583

[echobt]

✅ Validated

VALID BUG - Confirmed in src/components/workbench/AuxiliarySidebar.tsx

The AuxiliaryHeader component's minimize button uses imperative style manipulation (e.currentTarget.style.background) in onMouseEnter/onMouseLeave handlers, which bypasses Solid's reactive style system.

Code evidence (lines 289-301):

• Button has static style={buttonStyle} with background: "transparent"
• onMouseEnter imperatively sets e.currentTarget.style.background = tokens.colors.interactive.hover
• onMouseLeave imperatively sets e.currentTarget.style.background = "transparent"

The video clearly demonstrates the bug: when the sidebar is closed via keyboard shortcut while the mouse is over the minimize button, the onMouseLeave event never fires, leaving the hover background stuck. This is a real UI state synchronization bug that affects user experience.

The fix would be to use Solid's reactive style system (e.g., createSignal for hover state) instead of direct DOM manipulation.