# How to detect url change (via popstate) on my extension?

**URL:** <https://discourse.mozilla.org/t/how-to-detect-url-change-via-popstate-on-my-extension/88769>\
**Category:** Development\
**Tags:** learning, development, issue\
**Created:** [November 18, 2021, 4:44pm UTC](https://discourse.mozilla.org/t/how-to-detect-url-change-via-popstate-on-my-extension/88769 "2021-11-18T16:44:38Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![reli](https://sea1.discourse-cdn.com/flex001/user_avatar/discourse.mozilla.org/reli/32/53020_2.png) [@reli](https://discourse.mozilla.org/u/reli)\
**Post date:** [November 18, 2021, 4:44pm UTC](https://discourse.mozilla.org/t/how-to-detect-url-change-via-popstate-on-my-extension/88769/1 "2021-11-18T16:44:38Z")

</div>

I’m creating a firefox extension to take notes whilst watching youtube videos. When on a youtube video I make a request to my backend which looks for notes tagged with the current URL.

So far I have this in the manifest

```auto
"content_scripts": [
    {... "run_at": "document_end", "js": ["content-script.js"]}],
    "background": { "persistent": false,"scripts": ["background.js"]},
    "sidebar_action": {
        ...
        "default_panel": "sidebar/index.html"
    }

```

In `sidebar/script.js` which links into `sidebar/index.html` I have this

```auto
browser.browserAction.onClicked.addListener(() => {
    browser.sidebarAction.close();
  });
  // get message on tab change
  browser.tabs.onActivated.addListener(function (activeInfo) {
    browser.tabs.get(activeInfo.tabId, function (tab) {
      GetInitialInfo(tab);
    });
  });
  // get message on page load
  browser.tabs.onUpdated.addListener(function (tabId, changeInfo, tab) {
    if (changeInfo.status == "complete") {
      GetInitialInfo(tab);
    }
  });
  // // on window load
  window.onload = function () {
    browser.tabs.query({ active: true, currentWindow: true }, function (tabs) {
      GetInitialInfo(tabs[0]);
    });
  };

```

The `GetInitialInfo` then does everything I want to, checks if the tab.url is youtube and so on.

It works fine, but if I click on another youtube video (because youtube uses `History.replaceState`) none of the above are triggered.

I tried using `window.addEventListener('popstate'...)` just under `window.onload` but nothing happened.

---

<div class="post-metadata">

**Author:** ![freaktechnik](https://sea1.discourse-cdn.com/flex001/user_avatar/discourse.mozilla.org/freaktechnik/32/37766_2.png) [@freaktechnik](https://discourse.mozilla.org/u/freaktechnik)\
**Post date:** [November 18, 2021, 10:37pm UTC](https://discourse.mozilla.org/t/how-to-detect-url-change-via-popstate-on-my-extension/88769/2 "2021-11-18T22:37:04Z")

</div>

The `popstate` listener would have to be in the content script.