Navigation in Chrome/Firefox extension

I've been working on my extension YTDownloaderNew, and in the ytm-content-script.js, I'm using this code to detect when the user navigates to a YouTube Music playlist:

navigation.addEventListener('navigate', () => {
    if (window.location.href.includes("music.youtube.com/playlist")) {
        playlistLoaded();
    }
});

It works perfectly fine in Edge and Chrome, but for some reason, it doesn't seem to work in Firefox. Is there a different event or method I can use for Firefox to achieve the same result?

I tried to intercept the popstate method, but it didn't really get me anywhere. I also went through the documentation on mozilla website, but I couldn’t find anything useful there.

Update

As I understand, Firefox doesn't support NavigationAPI. Also, the method with YouTube navigation works perfectly with YouTube, but for some reason, it doesn't work with YouTube Music.

I've done it like this for now:

if (window.navigation) {
    navigation.addEventListener('navigate', () => {
        if (window.location.href.includes("music.youtube.com/playlist")) {
            playlistLoaded();
        }
    });
} else {
    setInterval(() => {
        if (window.location.href.includes("music.youtube.com/playlist")) {
            playlistLoaded();
        }
    }, 1000);
}

You can try using tabs.onUpdated and/or tabs.onCreated.

---

Source: Guest271314 helped me in the comment section.

Solution

I created background.js

chrome.tabs.onUpdated.addListener((tabId, changeInfo, tab) => {
    if (changeInfo.url && changeInfo.url.includes("music.youtube.com")) {
        chrome.tabs.sendMessage(tabId, { action: "playlistLoaded" });
    }
});

And modified my ytm-content.js

chrome.runtime.onMessage.addListener((message, sender, sendResponse) => {
    if (message.action === "playlistLoaded") {
        playlistLoaded();
    }
});