[js] Issue with Moving to the Previous Page in Browser after Using window.history.pushState [356770838]

Assigned

Bug

Needs-Triage-M127

Triaged-ET

Available

Status Update

No update yet.

Description

2d...@gmail.com

created issue #1

Aug 1, 2024 05:15PM

NOTE: Changing the template (or component which causes a template change) may change the access level this bug defaults to and it may no longer be confidential.

Chrome Version: 127.0.6533.89 (공식 빌드) (64비트) (cohort: Stable Installs & Version Pins) Lacros Version (if applicable): (copy from chrome://version) OS: Win11

What steps will reproduce the problem? (1)

window.history.replaceState(null, "", "/");
window.history.pushState(null, "", "/step/1");
window.history.pushState(null, "", "/step/2");
window.history.pushState(null, "", "/step/3");

What is the expected result?

When a user enters https://blabla.com/step/3 and clicks to move to the previous page in the browser, the pages should navigate in the order of /step/2 -> /step/1 -> /.

What happens instead? However, after checking on the Chrome browser, I found that it behaves differently depending on two cases.

Case 1: If the user visits https://blabla.com/step/3 and clicks to move to the previous page without clicking anywhere in the browser's viewport, the history does not follow the added states.

Case 2: If the user visits https://blabla.com/step/3 and attempts an action in the browser's viewport before clicking to move to the previous page, the history follows the added states.

I would like to know if Case 1 is a bug in the Chrome browser or an intended feature. If it is an intended feature, please provide a reference link regarding the behavior of navigating to the previous page in Chrome.

I have attached GIF files demonstrating the behavior of Case 1 and Case 2.

deleted

0 B

deleted

0 B

Comments

2d...@gmail.com <2d...@gmail.com> #2
Restricted
Aug 1, 2024 05:20PM

Learn More

case1.gif

Restricted

394 KB

View

Download

case2.gif

Restricted

364 KB

View

Download

ss...@google.com <ss...@google.com> #3Aug 2, 2024 10:14AM

@Reporter: Could you please provide sample file which you are facing the issue.

Thanks.

2d...@gmail.com <2d...@gmail.com> #4Aug 3, 2024 04:16AM

@ss...@google.com

I will share the GitHub repository I worked on. github repository

Instructions for running it locally are provided in the README.md file.

After running npm run dev, you can access it by entering http://localhost:3000/step/3 in your browser's address bar.

If you have any questions, please leave a comment.

Message last modified on Aug 3, 2024 04:20AM

pe...@google.com <pe...@google.com> #5Aug 3, 2024 04:30AM

Thank you for providing more feedback. Adding the requester to the CC list.

ss...@google.com <ss...@google.com> #6Aug 5, 2024 09:22AM

Tested the issue on chrome version #127.0.6533.89 using Windows 10 as per steps in

comment#1

Steps to reproduce:
=================
1) Open command prompt.
2) Change directory to a given downloaded file.
3) Enter given commands in command prompt. (npm install, npm run dev)
4) Launch chrome
5) Navigate to the url (

http://localhost:3000/step/3)
6) Click on back button

Observed that "able to navigate to the Previous Page without any issues"

@Reporter: Could you please
1) Review the attached screencast and let us know if we missed anything from our end.
2) Provide a screencast in video format instead of gif format for better understanding/triaging the issue.
3) Provide a expected/actual behavouir with clear reproducible steps.

Attaching screencast for reference

Thanks.

127-356770838.mkv

2.6 MB

Download

2d...@gmail.com <2d...@gmail.com> #7Aug 5, 2024 11:24AM

Hello,

Here are the steps to reproduce the issue with the attached screen recording file.

Run npm install, then npm run dev
Navigate to http://localhost:3000/step/3 in your browser
Click the back button immediately without clicking on the website viewport area in Chrome

These steps correspond to the 0-13 second mark in the attached video.

Here are the steps to make it work as I intend:

Run npm install, then npm run dev
Navigate to http://localhost:3000/step/3 in your browser
Click on the website viewport area in Chrome, then click the back button
Go to http://localhost:3000/step/2
Click the back button in the browser again
Go to http://localhost:3000/step/1

These steps correspond to the 17-30 second mark in the attached video.

I am curious why, when I click the back button without clicking on the Chrome browser's viewport area, it does not navigate from http://localhost:3000/step/3 to http://localhost:3000/step/2 in sequence.

I wonder if this is due to an issue with the Chrome browser.

Thank you.

record_2024-08-05_pm7.59.39.mov

2 MB

Download

pe...@google.com <pe...@google.com> #8Aug 5, 2024 11:28AM

Thank you for providing more feedback. Adding the requester to the CC list.

ss...@google.com <ss...@google.com> #9Aug 7, 2024 10:39AM

Retested the issue on chrome version #127.0.6533.89 using Windows 10 as per steps in

comment#1

, #7

Observed that "able to navigate to the Previous Page without any issues"

@Reporter: Could you please
1) Review the attached screencast and let us know if we missed anything from our end.
2) Try to check the issue without flags enabled, extensions and with a fresh profile.

Attaching screencast for reference

Thanks.

127--356770838.webm

16 MB

Download

2d...@gmail.com <2d...@gmail.com> #10Aug 7, 2024 04:40PM

Hello,

When you run the code I shared in the GitHub repo, clicking the browser back button should navigate in the order of '/step/3' -> '/step/2' -> '/step/1'. (You can check this by watching the screencast attached in

comment #7

from 00:17 to 00:30.)

However, in the screencast you posted in

comment #9

, clicking the back button navigates from '/step/3' to the default tab.
In the screencast I posted in

comment #9

, in order for the move from '/step/3' to '/step/2' to work when clicking the back button, you need to click once in the website viewport area in the Chrome browser before clicking the back button.

I am curious why it works as expected only when clicking the website viewport area before clicking the back button.

Thanks.

pe...@google.com <pe...@google.com> #11Aug 7, 2024 04:46PM

Thank you for providing more feedback. Adding the requester to the CC list.

ss...@google.com <ss...@google.com> #12Aug 9, 2024 11:46AM

Able to reproduce the issue on latest chrome version #127.0.6533.100 using Windows 11 as per

comment #1

Reproducible:
===================
Stable: 127.0.6533.100
Beta: 128.0.6613.27
Dev: 129.0.6628.3
Canary: 129.0.6646.0

Observed that
1) Navigated from

http://localhost:3000/step/3 to home page when directly clicking to back page
2) Navigated from

http://localhost:3000/step/3 >

http://localhost:3000/step/2 >

http://localhost:3000/step/1 to home page in squence when clicking to back page after select the matter in page

Note: Able to repro issue reproducible on Linux debian and Mac 14.5

The issue is seen from M-117, Considering this is a non regression issue.Hence marking it as Untriaged and requesting someone from the respective team to look into this further updates.

Thanks.

117-356770838.webm

19 MB

Download

M127-356770838.webm

13 MB

Download

2d...@gmail.com <2d...@gmail.com> #13Aug 10, 2024 07:15AM

Thank you for reviewing the issue.

ra...@chromium.org <ra...@chromium.org> #14Aug 13, 2024 06:50AM

Assigned to sh...@chromium.org.

[Navigation triage] From the description it sounds like this might be caused by Chrome skipping navigation entries added without user gestures, so this might be WAI. Let me add shivanisha@ who worked on that to confirm.

IssueTracker

This issue is a part of the Chromium tracker.