Query params added with history.pushState/replaceState are removed after scrolling

[miDeb]

Version:

• @inertiajs/react version: 2.0.0

Describe the problem:

On one page of my application I have to use a dependencly (@calcom/atoms) that, when making a selection in its component, "records" this by pushing a new state through the History API. This means the url in the browser is updated and something like &slot=2025-02-17T08%3A00%3A00.000Z is appended
Inertia naturally does not know about this, and after scrolling the page it itself pushes a new state to the history (to record the scroll offset), which however does not include the previous url change, causing the url to revert to a previous state. The dependency reacts badly to this in some circumstances, e.g. by immediately closing a popup it just opened.
As a workaround I removed the scroll listener Inertia adds, which fixed the issue for me. I think that's a bit of an ugly workaround, so I'm open to suggestions for a better one.

Steps to reproduce:

Call history.pushState(history.state, "" , "?query") from the console on a page with Inertia, then scroll. Observe as the query parameter in the url bar disappears.

The relevant code appears to be this:

inertia/packages/core/src/history.ts

Line 113 in fc8e1d4

this.current.url!,

Here the current url (as known to Inertia) is passed which will then replace the (real) current url. Since an update to the url is not the goal here, maybe it could simply not be passed so the browser doesn't update it?

[neluba]

This also happens with vue

[mvinnicius22]

also having exacly the same issue, using inertiajs/vue3. Do you recommend any workaround for now? @neluba @miDeb

[miDeb]

@mvinnicius22 you can make the changes from #2280 yourself locally using something like patch-package or yarn patch (the shipped code is minified, but if you look for the saveScrollPositions function you should be able to find the correct spot to change).
There might be an easier way, but that's the workaround I used.