No trigger for either hashchange or popstate event on window

[orty]

Hi,

We were using the v7 of your library since a couple of years ago now, and we decided to migrate to the new v8 one. We are experiencing an issue with detecting the navigation event, we need it to wait for the URL to be updated in the address bar before continuing a process.

An example :
The user search for a string in a searchbox. We put the query in the URL (with hash = true), which gives us 2 things :

• a way to retrieve the issued query if the page is shared by copy/pasting the URL
• a way to handle the full interaction history with the built-in back/forward feature of the browser.

This is how things are on our side :

router = new Navigo(root, { hash: true });

const shouldResolve = (e.detail && e.detail.pauseRouter === true) ? false : true; // our own condition to ignore the resolution for a non-navigation URL change (for example, for the use case I detailed before
this.router.navigate(href, { callHandler: shouldResolve );

To be exhaustive, I checked that, even for a case when shouldResolve is set to true (when issuing a real navigation from one page to another), the following event listener do not get fired :

window.addEventListener("hashchange", function() {console.log('HASHCHANGE', arguments)});
window.addEventListener("popstate", function() {console.log('POPSTATE', arguments)});

What is wrong in our implementation ?

Many thanks !

[krasimir]

Hey,

just so I build the full context

we need it to wait for the URL to be updated in the address bar

who and how is updating the address bar? Is that Navigo again or you have some other logic?

[orty]

Hey,

This is done by Navigo itself, we do not update the URL ourselves.

Moreover, I did some new tests by adding an after hook and triggering a CustomEvent in it, which I can then listen wherever I need it. But the hook never gets called neither :/ (even if my handler is executed) . It seems that I am really doing something wrong but I fail to see what :)

Regarding my first message, I now see, after reading through the source code, that the location.hash is not directly updated when using hash: true, you only push the new entry to the history. And we lack a direct action from the user (the navigation itself is asynchronous and based on a CustomEvent, so the popstate event can never be fired, as stated here).