Bug 1405456 - Update JSON Viewer theme when the devtools theme changes. r=Honza

MozReview-Commit-ID: F4tJRCDGfQn

--HG--
extra : rebase_source : bc89deda4c022a1e92f78d11268b157e254ec22a

devtools/client/jsonview/converter-child.js

@@ -124,6 +124,7 @@ Converter.prototype = {
     win.addEventListener("DOMContentLoaded", event => {
       win.addEventListener("contentMessage", onContentMessage, false, true);
     }, {once: true});
+    keepThemeUpdated(win);
 
     // Send the initial HTML code.
     let bytes = encoder.encode(initialHTML(win.document));
@@ -322,6 +323,18 @@ function initialHTML(doc) {
     startTag("plaintext", {"id": "json"});
 }
 
+function keepThemeUpdated(win) {
+  let listener = function () {
+    let theme = Services.prefs.getCharPref("devtools.theme");
+    win.document.documentElement.className = "theme-" + theme;
+  };
+  Services.prefs.addObserver("devtools.theme", listener);
+  win.addEventListener("unload", function (event) {
+    Services.prefs.removeObserver("devtools.theme", listener);
+    win = null;
+  }, {once: true});
+}
+
 // Chrome <-> Content communication
 function onContentMessage(e) {
   // Do not handle events from different documents.

devtools/client/jsonview/test/browser.ini

@@ -43,6 +43,7 @@ skip-if = (os == 'linux' && bits == 32 && debug) # bug 1328915, disable linux32
 [browser_jsonview_save_json.js]
 support-files =
   !/toolkit/content/tests/browser/common/mockTransfer.js
+[browser_jsonview_theme.js]
 [browser_jsonview_slash.js]
 [browser_jsonview_valid_json.js]
 [browser_json_refresh.js]

devtools/client/jsonview/test/browser_jsonview_theme.js

@@ -0,0 +1,34 @@
+/* -*- indent-tabs-mode: nil; js-indent-level: 2 -*- */
+/* vim: set ts=2 et sw=2 tw=80: */
+/* Any copyright is dedicated to the Public Domain.
+ * http://creativecommons.org/publicdomain/zero/1.0/ */
+
+"use strict";
+
+const TEST_JSON_URL = URL_ROOT + "valid_json.json";
+
+add_task(function* () {
+  info("Test JSON theme started.");
+
+  let oldPref = SpecialPowers.getCharPref("devtools.theme");
+  SpecialPowers.setCharPref("devtools.theme", "light");
+
+  yield addJsonViewTab(TEST_JSON_URL);
+
+  is(yield getTheme(), "theme-light", "The initial theme is light");
+
+  SpecialPowers.setCharPref("devtools.theme", "dark");
+  is(yield getTheme(), "theme-dark", "Theme changed to dark");
+
+  SpecialPowers.setCharPref("devtools.theme", "firebug");
+  is(yield getTheme(), "theme-firebug", "Theme changed to firebug");
+
+  SpecialPowers.setCharPref("devtools.theme", "light");
+  is(yield getTheme(), "theme-light", "Theme changed to light");
+
+  SpecialPowers.setCharPref("devtools.theme", oldPref);
+});
+
+function getTheme() {
+  return getElementAttr(":root", "class");
+}

devtools/client/jsonview/test/doc_frame_script.js

@@ -58,6 +58,13 @@ addMessageListener("Test:JsonView:GetElementVisibleText", function (msg) {
   sendAsyncMessage(msg.name, {text: text});
 });
 
+addMessageListener("Test:JsonView:GetElementAttr", function (msg) {
+  let {selector, attr} = msg.data;
+  let element = content.document.querySelector(selector);
+  let text = element ? element.getAttribute(attr) : null;
+  sendAsyncMessage(msg.name, {text: text});
+});
+
 addMessageListener("Test:JsonView:FocusElement", function (msg) {
   let {selector} = msg.data;
   let element = content.document.querySelector(selector);

devtools/client/jsonview/test/head.js

@@ -123,6 +123,14 @@ function getElementText(selector) {
   });
 }
 
+function getElementAttr(selector, attr) {
+  info("Get attribute '" + attr + "' for element '" + selector + "'");
+
+  let data = {selector, attr};
+  return executeInContent("Test:JsonView:GetElementAttr", data)
+  .then(result => result.text);
+}
+
 function focusElement(selector) {
   info("Focus element: '" + selector + "'");