scrollToRow method and scrollToIndex prop in List when using WindowScroller broken since 9.20.0

[driskell]

Bug Report

https://codesandbox.io/p/sandbox/react-virtualized-list-with-width-100-forked-gr3hcg?file=%2Fpackage.json%3A8%2C31

This example has a WindowScroller, with a AutoSizer and a List.

Clicking scrollToRow will attempt to use the scrollToRow method on the List.

Clicking prop:scrollToIndex will attempt to use the scrollToIndex prop on the List.

Since 9.19.0 when, I think (not checked this is exact cause), the componentWillReceiveProps was refactored the scrollToRow function no longer works.
Since 9.20.0 when, I think (not checked this is exact cause), the scrollTop was ignored in preference of scrollToRow etc., the scrollToIndex no longer works.

I investigated specifically the scrollToRow method and the issue is that calling setState since React 16.4 also triggers the getDerivedStateFromProps. Previously it matched componentWillReceiveProps and didn't call on setState. So I believe in the refactor of Grid to getDerivedStateFromProps the behaviour changed - it now gets called after the setState that sets the scrollTop. And unfortunately, the getDerivedStateFromProps ignores the value in prevState.

I think part of the issue is WindowScroller passes its scrollTop in. Which is then 0. And so this overrides the scrollToRow request. Likely this all needs handling in componentDidUpdate so that it can see the previous of both and work out if a change is requested as its at that point I assume it can tell which requested an action.

What is the current behavior?

https://codesandbox.io/p/sandbox/react-virtualized-list-with-width-100-forked-gr3hcg?file=%2Fpackage.json%3A8%2C31

Change the version accordingly to reproduce.

What is the expected behavior?

Both options to work

Which versions of React and react-virtualized, and which browser / OS are affected by this issue? Did this work in previous versions of react-virtualized?

Browser	Chrome, Safari
OS	macOS
React	16, 17
React DOM	16, 17
react-virtualized	9.20.0+

[driskell]

I’m working on a fix for the scrollToIndex method. We need to store the previous scroll top in instanceProps and only process it if changed in getDerivedStateFromProps. Not checked on the second issue but I assume it is related to same conflict so this fix might fix that too potentially.

[mateussiqueira]

Traced through the code. The issue matches what you described:

1. scrollToRow() calls setState({ scrollTop: value }) (Grid.js:~210)
2. Since React 16.4+, setState triggers getDerivedStateFromProps
3. getDerivedStateFromProps in Grid overwrites scrollTop from state with the scrollToRow/ scrollToIndex derived value (or resets it)

The fix would be in getDerivedStateFromProps to check if scrollToRow/ scrollToIndex actually changed from props before overriding state, or to let the manual scroll take priority when called imperatively.

A simpler workaround for now: pass scrollToIndex as a prop and change the key to force re-render, or use Grid directly with scrollTop control.

[driskell]

All 3 of my fixes just got closed as stale even though I had no stale requests so not sure what’s happening