Adding upstream version 1:115.7.0.upstream/1%115.7.0upstream

Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>

1 files changed, 60 insertions, 0 deletions

diff --git a/devtools/client/shared/stylesheet-utils.js b/devtools/client/shared/stylesheet-utils.js
new file mode 100644
index 0000000000..d9ee7b4437
--- /dev/null
+++ b/devtools/client/shared/stylesheet-utils.js
@@ -0,0 +1,60 @@
+/* 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";
+
+function stylesheetLoadPromise(styleSheet, url) {
+  return new Promise((resolve, reject) => {
+    styleSheet.addEventListener("load", resolve, { once: true });
+    styleSheet.addEventListener("error", reject, { once: true });
+  });
+}
+
+/*
+ * Put the DevTools theme stylesheet into the provided chrome document.
+ *
+ * @param  {Document} doc
+ *         The chrome 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(doc, url) {
+  if (doc.head) {
+    const styleSheet = doc.createElement("link");
+    styleSheet.setAttribute("rel", "stylesheet");
+    styleSheet.setAttribute("href", url);
+    const loadPromise = stylesheetLoadPromise(styleSheet);
+
+    // In order to make overriding styles sane, we want the order of loaded
+    // sheets to be something like this:
+    //   global.css
+    //   *-theme.css (the file loaded here)
+    //   document-specific-sheet.css
+    // See Bug 1582786 / https://phabricator.services.mozilla.com/D46530#inline-284756.
+    const globalSheet = doc.head.querySelector(
+      "link[href='chrome://global/skin/global.css']"
+    );
+    if (globalSheet) {
+      globalSheet.after(styleSheet);
+    } else {
+      doc.head.prepend(styleSheet);
+    }
+    return { styleSheet, loadPromise };
+  }
+
+  const styleSheet = doc.createProcessingInstruction(
+    "xml-stylesheet",
+    `href="${url}" type="text/css"`
+  );
+  const loadPromise = stylesheetLoadPromise(styleSheet);
+  doc.insertBefore(styleSheet, doc.documentElement);
+  return { styleSheet, loadPromise };
+}
+
+exports.appendStyleSheet = appendStyleSheet;