LearnNewsExamplesServices
Frontmatter
id9395
titleE2E: Refine GridRowScrollPinning to Target Explicit Thumb Drags
stateClosed
labels
enhancementaiarchitecturegrid
assigneestobiu
createdAtMar 8, 2026, 6:12 PM
updatedAtMar 8, 2026, 6:15 PM
githubUrlhttps://github.com/neomjs/neo/issues/9395
authortobiu
commentsCount1
parentIssue9380
subIssues[]
subIssuesCompleted0
subIssuesTotal0
blockedBy[]
blocking[]
closedAtMar 8, 2026, 6:15 PM

E2E: Refine GridRowScrollPinning to Target Explicit Thumb Drags

Closed v12.1.0 enhancementaiarchitecturegrid
tobiu
tobiu commented on Mar 8, 2026, 6:12 PM

This ticket documents the refinement of the GridRowScrollPinning addon to solve the "wheel jitter" regression.

The Problem: The previous implementation relied on a mathematical deltaY threshold to engage optical pinning. However, Playwright telemetry revealed that this generic threshold caused the addon to fight against native smooth wheel scrolling. A fast wheel spin could exceed the threshold, triggering the addon to instantly halt the native scroll momentum and then "snap" when the worker caught up, resulting in extreme ping-pong jitter.

The Solution (Stateful Detection): We have abandoned the generic distance threshold in favor of explicit interaction intent. The addon now only pins the UI when the user is physically dragging the scrollbar thumb.

Implementation Details:

  1. Lifecycle Hook: ScrollManager now passes the scrollbarId to the addon during registration.
  2. Targeted Mousedown: GridRowScrollPinning attaches mousedown and touchstart listeners explicitly to the custom VerticalScrollbar component, engaging an isThumbDragging state.
  3. Global Mouseup: To safely catch the drag release (even if the cursor leaves the browser window), a global window mouseup listener is dynamically attached during the drag and immediately removed upon release to prevent memory leaks in Card Layout unmount scenarios.
  4. Debounced Safety Net: A 250ms debounced scroll listener acts as an ultimate fallback to clear the isThumbDragging state if the global mouseup is somehow missed.
  5. Exclusive Pinning: applyPinning now only applies the CSS optical shift if isThumbDragging is true.

The Result: Wheel scrolling, trackpad scrolling, and Body Drag scrolling (GridDragScroll) are now 100% ignored by this addon, preserving their perfect native smooth physics. Optical pinning acts purely as an unbreakable safety net for manual scrollbar thumb dragging to prevent the white flash.

tobiu added the enhancement label on Mar 8, 2026, 6:12 PM
tobiu added the ai label on Mar 8, 2026, 6:12 PM
tobiu added the architecture label on Mar 8, 2026, 6:12 PM
tobiu added the grid label on Mar 8, 2026, 6:12 PM
tobiu added parent issue #9380 on Mar 8, 2026, 6:12 PM
tobiu referenced in commit 46ee4c1 - "Enhancement: Refine GridRowScrollPinning to Target Explicit Thumb Drags (#9395) on Mar 8, 2026, 6:14 PM
tobiu assigned to @tobiu on Mar 8, 2026, 6:14 PM
tobiu
tobiu Mar 8, 2026, 6:14 PM

Input from Gemini 3.1 Pro:

✦ The "Stateful Source Detection" refactor has been successfully tested, committed, and pushed.

Final Summary:

  • The addon now strictly tracks user intent via mousedown on the VerticalScrollbar component, engaging an isThumbDragging state.
  • Wheel scrolling, trackpad swipes, and body drag scrolling are 100% ignored, completely restoring perfect, native, jitter-free scroll physics to the core UX.
  • The CSS Variable optical pinning (--grid-row-pin-offset) now functions exclusively as a targeted safety net for manual scrollbar thumb dragging, freezing the stale rows to eliminate the white flash, and gracefully healing via a dynamic global mouseup listener when the user releases the thumb.

This concludes the architectural goals defined in this ticket. Closing.

tobiu closed this issue on Mar 8, 2026, 6:15 PM