[data grid] Datagrid Seems to Scroll On It's own

[lisaWriteJava]

The problem in depth

When scrolling the grid, quickly the page will continue to scroll even when the user stops. If there are enough items, it will jump around. This demo shows the continued scrolling: https://stackblitz.com/edit/react-obcliq?file=Demo.js We used similar configuration with v6 and our testers couldn't reproduce the error but it's showing now that we're on v7.

npmPackages:
"@emotion/react": "latest",
    "@emotion/styled": "latest",

    "@mui/icons-material": "^5.15.15",
    "@mui/lab": "^5.0.0-alpha.170",
    "@mui/material": "^5.15.15",
    "@mui/private-theming": "^5.15.14",
    "@mui/styles": "^5.15.15",
    "@mui/utils": "^5.15.14",
    "@mui/x-charts": "^7.4.0",
    "@mui/x-data-grid-generator": "^7.2.0",
    "@mui/x-data-grid-premium": "^7.2.0",
    "@mui/x-license": "^7.2.0"
"react": "^18.2.0",
"react-dom": "^18.2.0",
"styled-components": "latest"

Your environment

`npx @mui/envinfo`

   System:
    OS: Linux 4.18 Red Hat Enterprise Linux 8.10 (Ootpa)
    CPU: (16) x64 AMD EPYC 7R13 Processor
    Memory: 57.08 GB / 61.31 GB
    Container: Yes
    Shell: 4.4.20 - /bin/bash
  Binaries:
    Node: 16.15.1 - ~/.nvm/versions/node/v16.15.1/bin/node
    Yarn: 1.22.22 - ~/.nvm/versions/node/v16.15.1/bin/yarn
    npm: 8.11.0 - ~/.nvm/versions/node/v16.15.1/bin/npm
  Managers:
    pip3: 9.0.3 - /usr/bin/pip3
    Yum: 4.7.0 - /usr/bin/yum
  Utilities:
    Git: 2.43.5 - /usr/bin/git
    Curl: 7.61.1 - /usr/bin/curl
  IDEs:
    Nano: 2.9.8 - /usr/bin/nano
    VSCode: 1.85.1 - /home/lmcart4/.vscode-server/bin/0ee08df0cf4527e40edc9aa28f4b5bd38bbff2b2/bin/remote-cli/code
    Vim: 8.0 - /usr/bin/vim
  Languages:
    Bash: 4.4.20 - /usr/bin/bash
    Perl: 5.26.3 - /usr/bin/perl
    Python3: 3.6.8 - /usr/bin/python3
  Browsers:
    Chrome: 128.0.6613.84

Search keywords: datagrid scrolling
Order ID: 66765

[michelengelen]

Hey @lisaWriteJava
I noticed your rows are missing a unique identifier, which can cause some unexpected behavior. You can find more details about this in the documentation here: Row identifier.

To help illustrate this, I went ahead and made a quick fix to your demo (check it out! here).

In the future, just a quick heads-up before opening issues for things that might be implementation details. If you ever get stuck and need a hand with your code, Stack Overflow or our Discord server are great places to get help from the community! They're full of awesome people who love tackling coding challenges.

[lisaWriteJava]

Thanks for the heads up and the assistance. I didn't see the issue on stack overflow. I'll check the other resource next time. Thanks again

…

On Sat, Sep 7, 2024, 5:04 AM Michel Engelen ***@***.***> wrote: Hey @lisaWriteJava <https://github.com/lisaWriteJava> I noticed your rows are missing a unique identifier, which can cause some unexpected behavior. You can find more details about this in the documentation here: Row identifier <https://mui.com/x/react-data-grid/row-definition/#row-identifier>. To help illustrate this, I went ahead and made a quick fix to your demo (check it out! here <https://stackblitz.com/edit/react-obcliq-pkjj3u?file=Demo.js>). In the future, just a quick heads-up before opening issues for things that might be implementation details. If you ever get stuck and need a hand with your code, Stack Overflow or our Discord server are great places to get help from the community! They're full of awesome people who love tackling coding challenges. — Reply to this email directly, view it on GitHub <#14526 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AAJMQOIAWPYUDY35ELLFXRDZVK6SXAVCNFSM6AAAAABNZI7DK6VHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDGMZVGEZDKNRWHA> . You are receiving this because you were mentioned.Message ID: ***@***.***>