Bug 1359090 - extract appendStyleSheet util from theme-switching to dedicated util;r=ochameau

MozReview-Commit-ID: 4MaGKbkyuZ9

--HG--
extra : rebase_source : 622115120ac1349b63175b6de088269e9f17e1ed

devtools/client/shared/moz.build

@@ -49,6 +49,7 @@ DevToolsModules(
     'scroll.js',
     'source-utils.js',
     'SplitView.jsm',
+    'stylesheet-utils.js',
     'suggestion-picker.js',
     'telemetry.js',
     'theme.js',

devtools/client/shared/stylesheet-utils.js

@@ -0,0 +1,43 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+/* eslint-env browser */
+"use strict";
+
+/*
+ * Append a stylesheet to the provided XUL document.
+ *
+ * @param  {Document} xulDocument
+ *         The XUL document where the stylesheet should be appended.
+ * @param  {String} url
+ *         The url of the stylesheet to load.
+ * @return {Object}
+ *         - styleSheet {XMLStylesheetProcessingInstruction} the instruction node created.
+ *         - loadPromise {Promise} that will resolve/reject when the stylesheet finishes
+ *           or fails to load.
+ */
+function appendStyleSheet(xulDocument, url) {
+  let styleSheetAttr = `href="${url}" type="text/css"`;
+  let styleSheet = xulDocument.createProcessingInstruction(
+    "xml-stylesheet", styleSheetAttr);
+  let loadPromise = new Promise((resolve, reject) => {
+    function onload() {
+      styleSheet.removeEventListener("load", onload);
+      styleSheet.removeEventListener("error", onerror);
+      resolve();
+    }
+    function onerror() {
+      styleSheet.removeEventListener("load", onload);
+      styleSheet.removeEventListener("error", onerror);
+      reject("Failed to load theme file " + url);
+    }
+
+    styleSheet.addEventListener("load", onload);
+    styleSheet.addEventListener("error", onerror);
+  });
+  xulDocument.insertBefore(styleSheet, xulDocument.documentElement);
+  return {styleSheet, loadPromise};
+}
+
+exports.appendStyleSheet = appendStyleSheet;

devtools/client/shared/theme-switching.js

@@ -10,6 +10,8 @@
   const Services = require("Services");
   const { gDevTools } = require("devtools/client/framework/devtools");
   const { watchCSS } = require("devtools/client/shared/css-reload");
+  const { appendStyleSheet } = require("devtools/client/shared/stylesheet-utils");
+
   let documentElement = document.documentElement;
 
   let os;
@@ -49,34 +51,6 @@
     documentElement.style.display = display;
   }
 
-  /*
-   * Append a new processing instruction and return an object with
-   *  - styleSheet: DOMNode
-   *  - loadPromise: Promise that resolves once the sheets loads or errors
-   */
-  function appendStyleSheet(url) {
-    let styleSheetAttr = `href="${url}" type="text/css"`;
-    let styleSheet = document.createProcessingInstruction(
-      "xml-stylesheet", styleSheetAttr);
-    let loadPromise = new Promise((resolve, reject) => {
-      function onload() {
-        styleSheet.removeEventListener("load", onload);
-        styleSheet.removeEventListener("error", onerror);
-        resolve();
-      }
-      function onerror() {
-        styleSheet.removeEventListener("load", onload);
-        styleSheet.removeEventListener("error", onerror);
-        reject("Failed to load theme file " + url);
-      }
-
-      styleSheet.addEventListener("load", onload);
-      styleSheet.addEventListener("error", onerror);
-    });
-    document.insertBefore(styleSheet, documentElement);
-    return {styleSheet, loadPromise};
-  }
-
   /*
    * Notify the window that a theme switch finished so tests can check the DOM
    */
@@ -112,7 +86,7 @@
 
     let loadEvents = [];
     for (let url of newThemeDef.stylesheets) {
-      let {styleSheet, loadPromise} = appendStyleSheet(url);
+      let {styleSheet, loadPromise} = appendStyleSheet(document, url);
       devtoolsStyleSheets.get(newThemeDef).push(styleSheet);
       loadEvents.push(loadPromise);
     }