Skip to content

[data grid] Scroll stutters when dragging a row in tree data mode #22718

Description

@matyas-igor

Steps to reproduce

Steps:

  1. Open this link to live example: Drag-and-drop tree data reordering
  2. Start dragging a row, hold the mouse button pressed
  3. Start scrolling
  4. See that scrolling stutters, then after reaching bottom, page jumps unexpectedly
  5. See that it's hard to scroll back up, page is not responsive to scroll anymore
Screen.Recording.2026-06-09.at.13.23.14.mov
Screen.Recording.2026-06-09.at.13.23.35.mov

Current behavior

Scroll stutters and debounces, and overall acts in a unexpected way

Expected behavior

Scrolling performance is stable and acts in the same way when item is not being dragged

Context

Drag-and-drop rows, when data grid is in tree data mode

Your environment

npx @mui/envinfo
  System:
    OS: macOS 26.5.1
  Binaries:
    Node: 22.16.0 - ~/.nvm/versions/node/v22.16.0/bin/node
    npm: 10.9.2 - ~.nvm/versions/node/v22.16.0/bin/npm
    pnpm: 9.15.4 - ~/.nvm/versions/node/v22.16.0/bin/pnpm
  Browsers:
    Chrome: 149.0.7827.55
  npmPackages:
    typescript: ^6.0.0 => 6.0.2

Search keywords: scroll, drag

Order ID: 116079

Metadata

Metadata

Assignees

Labels

scope: data gridChanges related to the data grid.support: premium standardSupport request from a Premium standard plan user. https://mui.com/legal/technical-support-sla.

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions