Navigation back or forward not working

aigan commented 5 months ago

Prerequisites

[X] I have written a descriptive issue title
[X] I have searched existing issues to ensure it has not already been reported

Version (i.e. v2.x.x)

1.0.1-alpha.200

Node.js version (i.e. 18.x, or N/A)

v18.16.0

Operating system

Linux

Operating system version (i.e. 20.04, 11.3, 10, or N/A)

Debian 12.5

Description

Using Firefox 123.0.1 (64-bit) on Linux. Tried several pre-packaged versions of navigation, including a rollup of @virtualstate/navigation/esnext/polyfill

The navigate event was sent and was working when clicking on links. But no event was sent for history navigation by clicking on browser navigate back or forward. Additionally, No navigation event was sent for traversal to new page by setting window.location. Also, the value of ev.downloadRequest was not null.

Steps to Reproduce

Created https://github.com/aigan/virtualstate-navigation-bugs

Also possibly availible on my workstation on https://hem.jonas.liljegren.org/proj/virtualstate-navigation-bugs/

Expected Behavior

Expecting the console to log the Navigate message from the navigate event

aigan commented 5 months ago

Ok. To be a bit clearer. The popstate event does fire on back/forward buttons if the navigation through the links was intercepted in the navigate handler. with something like

    ev.intercept({
      async handler() { 
        const res = await fetch(ev.destination.url);
        document.body.innerHTML = await res.text();
      }
    })

But in chrome, the navigate event will fire on going back to previous page that was traversed through normal page navigation through a href links. If that is not possible to polyfill, it's something that should be mentioned as a limitation in the polyfill README.

That being said, I'll open another issue about the window.location issue.

fabiancook commented 5 months ago

Commenting here to mention that I have had a go at finding a solution for this one, but it appears rather difficult. I can intercept these with beforeunload, but I can't seem to get any details about the destination (whether its back, forward, or reload).

I'll continue investigating here.

virtualstate / navigation