Use new theme_icons manifest for specifying light and dark icons. Fixes #603

webextension/background.js

@@ -1,5 +1,6 @@
 const MAJOR_VERSIONS = ["2.3.0", "2.4.0"];
 const LOOKUP_KEY = "$ref";
+const THEME_BUILD_DATE = 20170630;
 
 const assignManager = {
   MENU_ASSIGN_ID: "open-in-this-container",
@@ -594,10 +595,18 @@ const messageHandler = {
 
 const themeManager = {
   existingTheme: null,
-  init() {
+  disabled: false,
+  async init() {
+    const browserInfo = await browser.runtime.getBrowserInfo();
+    if (Number(browserInfo.buildID.substring(0, 8)) >= THEME_BUILD_DATE) {
+      this.disabled = true;
+    }
     this.check();
   },
   setPopupIcon(theme) {
+    if (this.disabled) {
+      return;
+    }
     let icons = {
       16: "img/container-site-d-24.png",
       32: "img/container-site-d-48.png"

webextension/manifest.json

@@ -48,6 +48,38 @@
       "16": "img/container-site-d-24.png",
       "32": "img/container-site-d-48.png"
     },
+    "theme_icons": [
+      {
+        "size": 16,
+        "dark": "img/container-site-d-24.png",
+        "light": "img/container-site-w-24.png"
+      },
+      {
+        "size": 24,
+        "dark": "img/container-site-d-24.png",
+        "light": "img/container-site-w-24.png"
+      },
+      {
+        "size": 32,
+        "dark": "img/container-site-d-48.png",
+        "light": "img/container-site-w-48.png"
+      },
+      {
+        "size": 48,
+        "dark": "img/container-site-d-48.png",
+        "light": "img/container-site-w-48.png"
+      },
+      {
+        "size": 96,
+        "dark": "img/container-site-d-96.png",
+        "light": "img/container-site-w-96.png"
+      },
+      {
+        "size": 192,
+        "dark": "img/container-site-d-192.png",
+        "light": "img/container-site-w-192.png"
+      }
+    ],
     "default_title": "Containers",
     "default_popup": "popup.html"
   },