Skip to content

fix(drag): continue autoscroll when widget dragged past root container edge#3311

Draft
developerVibhay wants to merge 1 commit into
gridstack:masterfrom
developerVibhay:fix/autoscroll-parent-grid
Draft

fix(drag): continue autoscroll when widget dragged past root container edge#3311
developerVibhay wants to merge 1 commit into
gridstack:masterfrom
developerVibhay:fix/autoscroll-parent-grid

Conversation

@developerVibhay

Copy link
Copy Markdown

Description

When a gridstack container is scrollable and you drag a widget aggressively toward the top of the browser window — pulling it fully above the container's visible area — autoscroll stops instead of continuing
to scroll up (or down when dragged below).

Root cause: _getClipping() in dd-draggable.ts had an early return for the "fully outside" case:

if (elRect.bottom < scrollRect.top || elRect.top > scrollRect.bottom) return 0;

This is correct for nested grid containers (the widget has left that grid, so the parent should take over). But when the scroll container is the document root, there is no parent to hand off to — scrolling
should continue at full speed.

Fix: Added an isRoot check so the early return only applies to nested containers:

const isRoot = scrollEl === (document.scrollingElement || document.documentElement);
if (!isRoot && (elRect.bottom < scrollRect.top || elRect.top > scrollRect.bottom)) return 0;

Example: Create a gridstack grid taller than the viewport (so the page scrolls). Grab the last widget and quickly drag it toward the top of the browser window past the visible area. Before this fix, autoscroll
would halt as soon as the widget left the visible bounds. After this fix, the container continues scrolling up until it reaches the top.

…r edge

When the scroll container is the document root, dragging a widget fully
above or below the visible area should keep scrolling. Previously the
'fully outside' early return in _getClipping stopped scrolling in that
case, making it impossible to scroll up by aggressively dragging near
the top edge.

Fix: skip the early-return only for nested (non-root) scroll containers.
Add 6 unit tests covering both the nested-stop and root-continue cases.
@developerVibhay
developerVibhay marked this pull request as draft July 17, 2026 06:00
@adumesny

Copy link
Copy Markdown
Member

shouldn't scrolling stop when we have nothing else to scroll instead of where item is relative to scrollRect ? I mean the original scrollElement shoud continue reguadless if we enter a parent grid or not. Also your check for main view but could be a regualr parent div that still above all grid, so your logic isn't matchign to wording anyway...

@adumesny adumesny left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

see comment

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.

2 participants