Undefined error after calling history.replaceState()
I'm trying to use a Livewire component on a page that uses tabs. The tabs use history.replaceState() to update the URL tab parameter.
let target = $(this).data('target');
const url = new URL(window.location.href);
url.searchParams.set('tab', target.substring(1));
window.history.replaceState('{}', '', url.toString());
This works fine when switching to the tab containing the Livewire component, however if i try to refresh the page, I get the following error
TypeError: Cannot set properties of undefined (setting 'perPage')
It's important to note that PerPage is a property that uses the #[Url] attribute to also update the URL. Without any of these, the component loads. And disabling history.replaceState() on the tabs also fixes the issue. Which certainly points to the issue being with the browser history manipulation.
Any thoughts would be appreciated.
Please or to participate in this conversation.