[data grid] Trackpad scrolling on Safari is jittery

[kthyer]

Steps to reproduce

Steps:

1. On Safari, open this link to live example: https://mui.com/x/react-data-grid/scrolling/?srsltid=AfmBOorb3qa7Q4NXrHKCPspGL_D8TGmZHbVoioPqAWjdt6Tgf_6EH74P
2. In any of the examples, use a laptop trackpad to slowly scroll on the talbe
3. Note the table display a jittery scroll behavior

Current behavior

Scrolling is jittery when using a trackpad on Safari

Screen.Recording.2025-03-06.at.2.49.04.PM.mov

Expected behavior

Scrolling should be smooth

Context

No response

Your environment

Laptop Environment

``` macOS Montery - Version 12.7.6 Macbook Pro Mid-2015 Safari - Version 17.6 (17618.3.11.11.7, 17618) ```

Packages

@emotion/react - 11.14.0
@emotion/styled - 11.14.0
@mui/material - 6.4.7
@mui/x-data-grid - 7.27.2
react - 19.0.0
react-dom - 19.9.9

Search keywords: datagrid, safari

[michelengelen]

I cannot reproduce the issue seen in the video.

Screen.Recording.2025-03-07.at.11.50.34.mov

But I am on a very different machine and MacOS version:

I'll ask around if we have someone from the team that's using a similar setup. Otherwise we would need to test this with browserstack.

[michelengelen]

Browserstack does not show this behavior as well ... 🤔

[kthyer]

I cannot reproduce the issue seen in the video.
Screen.Recording.2025-03-07.at.11.50.34.mov

But I am on a very different machine and MacOS version:

I'll ask around if we have someone from the team that's using a similar setup. Otherwise we would need to test this with browserstack.

It looks like you are scrolling fast in the video. I don't notice it when I scroll at a "normal" or fast speed. But if I use the touch pad to scroll very slowly I get this jitter that is noticeable. On occasion it is still smooth but after a few rows it normally has this jitter again. I am sure this very environment dependent though.

[kthyer]

If I "flick" my fingers to use the inertia scrolling it will also kind of jitter around. Doesn't matter if I do vertical or horizontal scrolling.

Screen.Recording.2025-03-07.at.12.45.54.PM.mov

[michelengelen]

I still cannot reproduce this on my machine or on Browserstack ... does this also happen on other browsers or is this strictly only safari? Did you try another version of Safari as well?