catch url changes with javascript credit https://stackoverflow.com/a/52809105/5765524

index.js

// history.pushState = ( f => function pushState(){
//     var ret = f.apply(this, arguments);
//     window.dispatchEvent(new Event('pushstate'));
//     window.dispatchEvent(new Event('locationchange'));
//     return ret;
// })(history.pushState);

// history.replaceState = ( f => function replaceState(){
//     var ret = f.apply(this, arguments);
//     window.dispatchEvent(new Event('replacestate'));
//     window.dispatchEvent(new Event('locationchange'));
//     return ret;
// })(history.replaceState);

// window.addEventListener('popstate',()=>{
//     window.dispatchEvent(new Event('locationchange'))
// });

// window.addEventListener('locationchange', function(){
//     console.log('location changed!');
// })

let previousUrl = ''

const observer = new MutationObserver(function(mutations) {
    if (location.href !== previousUrl) {
          previousUrl = location.href

          console.log(`Navigated to ${location.href}`)
    }
})

const config = { subtree: true, childList: true }

observer.observe(document, config)