When using useWindowVirtualizer across multiple screens, the scroll position is carried over. Is there a way to reset it?

[shunshimono]

Hello,

In my project, I am using Next.js and @tanstack/react-virtual. When using useWindowVirtualizer across multiple screens, the scroll position from the previous screen is automatically restored.

Reproducible Environment

CodeSandbox Example

Reproduction Steps

Scroll on localhost:3000
Navigate to the ABOUT PAGE

Expected Behavior

The scroll position should start from the top.

Things I Tried but Didn't Work

Executing the measure method and initializing the cache on unmount: measure method
Setting initialOffset to 0: initialOffset
Setting scrollToOffset to 0 on mount: scrollToOffset

Additional Observations

If I don't use measureElement, this issue doesn't occur.
I hypothesize that this is caused by the cache of measureElement being shared across screens. If anyone knows a solution, I would appreciate your support.

Thank you for reading.

[shunshimono]

memo:

• Even with history.scrollRestoration: 'manual', it still happens.
• It still happens with the latest version (v3.5.1).

[shunshimono]

Although I haven't fully traced the code yet, I have found the following points:

1. When scrolling on a screen that uses useWindowVirtualizer and measureElement, and then navigating to another screen using the same API via SPA, resizeItem is triggered.
2. If shouldAdjustScrollPositionOnItemSizeChange is undefined, the default scroll adjustment logic condition becomes true, causing the scroll position to revert to the previous screen's position.
3. By modifying the type definitions and the Virtualizer class to return false for shouldAdjustScrollPositionOnItemSizeChange, the issue can be resolved.

However, I find the functionality of adjusting the scroll position during resizing to be very useful. From my debugging, I have determined that the root cause is that this.scrollOffset or this.scrollAdjustments retains the previous values. I will continue reading the code to further investigate this issue.

[shunshimono]

[Update]
I have discovered that during page transitions in Next.js, the scrollend event is triggered, causing the scroll position to be restored. This happens because the scroll option in Next.js's Link component is set to true by default, which attempts to adjust the scroll position before the transition.

I believe this can be addressed by custom controlling the timing of the observeElementOffset trigger.

[msmoter]

@shunshimono did you manage to fix this in your code? I am facing the same issue and nothing works properly. Sometimes window.scrollTo(0,0) during mounting works, but sometimes not and it does not satisfies me :)