Remove retired theme aliases (mdn#430)

* Remove required theme aliases

Replaced uses of headerURL, accentcolor, and textcolor with theme_frame, frame, and tab_background_text. Tested and confirmed all extensions working as expected.

* Fixed another reference to headerURL

Co-authored-by: Richard Bloor <rbloor@atlassian.com>

dynamic-theme/background.js

@@ -3,20 +3,20 @@ var currentTheme = '';
 const themes = {
   'day': {
     images: {
-      headerURL: 'sun.jpg',
+      theme_frame: 'sun.jpg',
     },
     colors: {
-      accentcolor: '#CF723F',
-      textcolor: '#111',
+      frame: '#CF723F',
+      tab_background_text: '#111',
     }
   },
   'night': {
     images: {
-      headerURL: 'moon.jpg',
+      theme_frame: 'moon.jpg',
     },
     colors: {
-      accentcolor: '#000',
-      textcolor: '#fff',
+      frame: '#000',
+      tab_background_text: '#fff',
     }
   }
 };

examples.json

@@ -535,7 +535,7 @@
         "name": "theme-switcher"
     },
     {
-        "description": "A collection of themes illustrating:<ul><li>weta_fade: a basic theme employing a single image specified in <code>headerURL:</code>.</li><li>weta_fade_chrome: the weta_fade theme implemented with Chrome compatible manifest keys.</li><li>weta_tiled: a theme using a tiled image.</li><li>weta_mirror: a theme using multiple images and aligning those images in the header.</li><li>animated: use of an animated PNG.</li></ul>",
+        "description": "A collection of themes illustrating:<ul><li>weta_fade: a basic theme employing a single image specified in <code>theme_frame:</code>.</li><li>weta_fade_chrome: the weta_fade theme implemented with Chrome compatible manifest keys.</li><li>weta_tiled: a theme using a tiled image.</li><li>weta_mirror: a theme using multiple images and aligning those images in the header.</li><li>animated: use of an animated PNG.</li></ul>",
         "javascript_apis": [],
         "name": "themes"
     },

private-browsing-theme/background.js

@@ -8,11 +8,11 @@ function themeWindow(window) {
   if (window.incognito) {
     browser.theme.update(window.id, {
       images: {
-        headerURL: "",
+        theme_frame: "",
       },
       colors: {
-        accentcolor: "black",
-        textcolor: "white",
+        frame: "black",
+        tab_background_text: "white",
         toolbar: "#333",
         toolbar_text: "white"
       }

theme-integrated-sidebar/README.md

@@ -10,6 +10,6 @@ How to use the browser.theme.getCurrent(), browser.theme.onUpdated and the sideb
 
 ## Instructions to try this
 
-- Install a WebExtension theme that sets `accentcolor`, `toolbar` or `toolbar_text`
+- Install a WebExtension theme that sets `frame`, `toolbar` or `toolbar_text`
 - Install this extension
 - The sidebar should then use colors from the WebExtension theme

theme-integrated-sidebar/sidebar.js

@@ -1,10 +1,9 @@
 function setSidebarStyle(theme) {
   const myElement = document.getElementById("myElement");
 
-  // colors.frame and colors.accentcolor are aliases
-  if (theme.colors && (theme.colors.accentcolor || theme.colors.frame)) {
+  if (theme.colors && theme.colors.frame) {
     document.body.style.backgroundColor =
-      theme.colors.accentcolor || theme.colors.frame;
+      theme.colors.frame;
   } else {
     document.body.style.backgroundColor = "white";
   }

themes/animated/README.md

@@ -2,7 +2,7 @@
 
 ## What it does
 
-Employs an animated PNG image as the headerURL image in a theme.
+Employs an animated PNG image as the theme_frame image in a theme.
 
 ## What it shows
 

themes/weta_fade/README.md

@@ -2,7 +2,7 @@
 
 ## What it does
 
-Employs a PNG image as the headerURL image in a theme.
+Employs a PNG image as the theme_frame image in a theme.
 
 ## What it shows