--- a/browser/components/extensions/ext-browserAction.js
+++ b/browser/components/extensions/ext-browserAction.js
@@ -113,19 +113,29 @@ this.browserAction = class extends Exten
       this.defaults.icon,
       await StartupCache.get(
         extension, ["browserAction", "default_icon_data"],
         () => this.getIconData(this.defaults.icon)));
 
     this.tabContext = new TabContext(tab => Object.create(this.defaults),
                                      extension);
 
+    // eslint-disable-next-line mozilla/balanced-listeners
+    this.tabContext.on("location-change", this.handleLocationChange.bind(this));
+
     this.build();
   }
 
+  handleLocationChange(eventType, tab, fromBrowse) {
+    if (fromBrowse) {
+      this.tabContext.clear(tab);
+      this.updateOnChange(tab);
+    }
+  }
+
   onShutdown(reason) {
     browserActionMap.delete(this.extension);
 
     this.tabContext.shutdown();
     CustomizableUI.destroyWidget(this.id);
 
     this.clearPopup();
   }

--- a/browser/components/extensions/test/browser/browser_ext_browserAction_context.js
+++ b/browser/components/extensions/test/browser/browser_ext_browserAction_context.js
@@ -209,16 +209,22 @@ add_task(async function testTabSwitchCon
          "badge": "d2",
          "badgeBackgroundColor": [0, 0xff, 0, 0xff],
          "disabled": false},
         {"icon": browser.runtime.getURL("default-2.png"),
          "popup": browser.runtime.getURL("default-2.html"),
          "title": "Default Title 2",
          "badge": "d2",
          "badgeBackgroundColor": [0, 0xff, 0, 0xff]},
+        {"icon": browser.runtime.getURL("default-2.png"),
+         "popup": browser.runtime.getURL("default-2.html"),
+         "title": "Default Title 2",
+         "badge": "d2",
+         "badgeBackgroundColor": [0, 0xff, 0, 0xff],
+         "disabled": false},
       ];
 
       return [
         async expect => {
           browser.test.log("Initial state, expect default properties.");
 
           await expectDefaults(details[0]);
           expect(details[0]);
@@ -246,30 +252,16 @@ add_task(async function testTabSwitchCon
           browser.browserAction.setTitle({tabId, title: "Title 2"});
           browser.browserAction.setBadgeText({tabId, text: "2"});
           browser.browserAction.setBadgeBackgroundColor({tabId, color: "#ff0000"});
           browser.browserAction.disable(tabId);
 
           await expectDefaults(details[0]);
           expect(details[2]);
         },
-        expect => {
-          browser.test.log("Navigate to a new page. Expect no changes.");
-
-          // TODO: This listener should not be necessary, but the |tabs.update|
-          // callback currently fires too early in e10s windows.
-          browser.tabs.onUpdated.addListener(function listener(tabId, changed) {
-            if (tabId == tabs[1] && changed.url) {
-              browser.tabs.onUpdated.removeListener(listener);
-              expect(details[2]);
-            }
-          });
-
-          browser.tabs.update(tabs[1], {url: "about:blank?1"});
-        },
         async expect => {
           browser.test.log("Switch back to the first tab. Expect previously set properties.");
           await browser.tabs.update(tabs[0], {active: true});
           expect(details[1]);
         },
         async expect => {
           browser.test.log("Change default values, expect those changes reflected.");
           browser.browserAction.setIcon({path: "default-2.png"});
@@ -291,16 +283,28 @@ add_task(async function testTabSwitchCon
         },
         async expect => {
           browser.test.log("Switch back to tab 2. Expect former value, unaffected by changes to defaults in previous step.");
           await browser.tabs.update(tabs[1], {active: true});
 
           await expectDefaults(details[3]);
           expect(details[2]);
         },
+        expect => {
+          browser.test.log("Navigate to a new page. Expect defaults.");
+
+          browser.tabs.onUpdated.addListener(function listener(tabId, changed) {
+            if (tabId == tabs[1] && changed.url) {
+              browser.tabs.onUpdated.removeListener(listener);
+              expect(details[6]);
+            }
+          });
+
+          browser.tabs.update(tabs[1], {url: "about:blank?1"});
+        },
         async expect => {
           browser.test.log("Delete tab, switch back to tab 1. Expect previous results again.");
           await browser.tabs.remove(tabs[1]);
           expect(details[4]);
         },
         async expect => {
           browser.test.log("Create a new tab. Expect new default properties.");
           let tab = await browser.tabs.create({active: true, url: "about:blank?2"});