CODEWITHSUNDEEP
google-chromesafaribrowser-historybackpushstate
Rinato
Rinato

Reputation: 63

Why does history.pushState() not get respected when using the built in browser back button in Safari 16.* and Chrome 107.0.5304?

I've found that in these versions of Safari and Chrome, pushing a new state value into the browsers history with no user input will behave unexpectedly. It will correctly update the state. You will be able to interact with that updated state using the browser history API. You will be able to use the MacOS shortcut of cmd + left and right to navigate forward and back in your history.

You will not be able to hit the browser "back" button and have it return to the initial url of the page you loaded. You will see the correct history when long clicking the "back" button. You will be able to call hsitory.back() correctly.

A simple example snippet:

<!DOCTYPE html>
<html>
<body>
    <script>
        window.history.pushState({a:1 }, '', window.location.pathname + "?page=1");
    </script>
    <h1>Safari History Issue</h1>
</body>
</html>

If you load up this html as an index file on a local server you can follow the following steps to reproduce this issue:

  1. Navigate to google.com
  2. Navigate to local server
  3. This should push state to ?page=1
  4. See that the initial local page (no param) as well as google are now in your browser history by long clicking on the back button
  5. Hit "Back" button on browser
  6. This will take you all the way back to google, not back to the initial local page prior to pushState()

If you pushState() as a result of a user action such as an onclick event this issue is not present.

I am wondering if there is some undocumented security updates in the latest versions of these browsers that is causing this issue?

Upvotes: 2

Views: 519

Answers (1)

Shenmin Zhou
Shenmin Zhou

Reputation: 31

Haven't been able to find any documentation, but it seems like history.pushState calls made BEFORE any user interaction (say click a button) are not "respected".

Upvotes: 2

Related Questions