refactor badge.displayBrowserActionBadge to be used in messageHandler.js fixes #973

src/js/background/badge.js

@@ -10,16 +10,29 @@ const badge = {
     browser.browserAction.setTitle({ tabId, title: "Containers disabled in Private Browsing Mode" });
   },
 
-  async displayBrowserActionBadge() {
+  async displayBrowserActionBadge(action) { 
     const extensionInfo = await backgroundLogic.getExtensionInfo();
-    const storage = await browser.storage.local.get({browserActionBadgesClicked: []});
+      function changeBadgeColorText(color, text){
-
+        browser.browserAction.setBadgeBackgroundColor({color: color});
-    if (MAJOR_VERSIONS.indexOf(extensionInfo.version) > -1 &&
+        browser.browserAction.setBadgeText({text: text});
-        storage.browserActionBadgesClicked.indexOf(extensionInfo.version) < 0) {
+      }
-      browser.browserAction.setBadgeBackgroundColor({color: "rgba(0,217,0,255)"});
+    if(action==="remove"){    
-      browser.browserAction.setBadgeText({text: "NEW"});
+      const ActionBadgesClickedStorage = await browser.storage.local.get({browserActionBadgesClicked: []});
+      if (MAJOR_VERSIONS.indexOf(extensionInfo.version) > -1 &&
+          ActionBadgesClickedStorage.browserActionBadgesClicked.indexOf(extensionInfo.version) < 0) {
+          changeBadgeColorText("rgba(0,217,0,255)", "NEW")
+      }
+    }
+    else if (action==="showAchievement"){
+      const achievementsStorage = await browser.storage.local.get({achievements: []});
+      achievementsStorage.achievements.push({"name": "manyContainersOpened", "done": false});
+      // use set and spread to create a unique array
+      const achievements = [...new Set(achievementsStorage.achievements)];
+      browser.storage.local.set({achievements});
+      changeBadgeColorText("rgba(0,217,0,255)", "NEW");
     }
   }
+    
 };
 
 badge.init();

src/js/background/messageHandler.js

@@ -171,13 +171,7 @@ const messageHandler = {
 
     // When the user opens their _ tab, give them the achievement
     if (countOfContainerTabsOpened === 100) {
-      const storage = await browser.storage.local.get({achievements: []});
+      badge.displayBrowserActionBadge("showAchievement");      
-      storage.achievements.push({"name": "manyContainersOpened", "done": false});
-      // use set and spread to create a unique array
-      const achievements = [...new Set(storage.achievements)];
-      browser.storage.local.set({achievements});
-      browser.browserAction.setBadgeBackgroundColor({color: "rgba(0,217,0,255)"});
-      browser.browserAction.setBadgeText({text: "NEW"});
     }
   },
 
@@ -187,7 +181,7 @@ const messageHandler = {
     // https://bugzil.la/1314674
     // https://github.com/mozilla/testpilot-containers/issues/608
     // ... so re-call displayBrowserActionBadge on window changes
-    badge.displayBrowserActionBadge();
+    badge.displayBrowserActionBadge("remove");
     browser.tabs.query({active: true, windowId}).then((tabs) => {
       if (tabs && tabs[0]) {
         assignManager.calculateContextMenu(tabs[0]);

src/js/popup.js

@@ -79,7 +79,7 @@ const Logic = {
   async init() {
     // Remove browserAction "upgraded" badge when opening panel
     this.clearBrowserActionBadge();
-
+    
     // Retrieve the list of identities.
     const identitiesPromise = this.refreshIdentities();
 
@@ -159,7 +159,7 @@ const Logic = {
     });
   },
 
-  async clearBrowserActionBadge() {
+ async clearBrowserActionBadge() {
     const extensionInfo = await getExtensionInfo();
     const storage = await browser.storage.local.get({browserActionBadgesClicked: []});
     browser.browserAction.setBadgeBackgroundColor({color: null});