Fix to make browser back button navigate pagination properly when faceted search is enabled

[bc-williamkwon]

What?

Tested on store: https://williamkwon1576004500-testly-the-third.my-integration.zone/
Previously, the browser back button would not navigate pagination properly when faceted search was enabled but now it does.

Tickets / Documentation

Add links to any relevant tickets and documentation.

• Link 1

Screenshots (if appropriate)
https://imgur.com/a/MtmIeIR

[bigbot]

Autotagging @bigcommerce/storefront-team @davidchin

[mattolson]

Please provide proof that the change works as expected.

[bc-williamkwon]

Added a screenshot and linked to store with theme that has changes applied to store.

[bookernath]

I see the issue is still happening with a filter applied, e.g.:

https://williamkwon1575504304-testsworthy.my-integration.zone/shop-all/?_bc_fsnf=1&brand=36&limit=2

From here, you can navigate to page 2 and then click the back button - you'll notice the page number in the content footer does not change, and the products do not update.

[ncheikh]

We are testing and this does not appear to be working, we are digging in now, I will circle with you @bc-williamkwon.

It looks like it does not add the page query param to when:
Case 1:

• Add Search Facet
• Go to Page 2
• Go Back via back button
• Still on page 2

Case 2:

• Go to Page 2
• Go Back via back button
• Still on page 2

Looks like the xhr request is not being fired when we go back

Needs further testing

[bc-williamkwon]

Made changes to trigger xhr request on back button click and check for page in query string.

[bookernath]

The issue with the page not reloading seems fixed now.

However, it appears that we've introduced a new bug with this change:

Now if I'm on page 1 and I directly click on page 3, and then click the back button, I'll be taken to page 2, even though I never visited that page so it shouldn't be in my history.

[bc-williamkwon]

Fixed said bug described in last comment

[bc-williamkwon]

Made change to only update page parameter. The default page has a sort by query string parameter so I believe that it should be fine to assume that the url string has a query parameter.

[bc-williamkwon]

Updated solution to use regex instead of split.

[bookernath]

I've tested all the cases I tested before, and this looks good now 💚

stale review