Bug 1500921 - Tunnel the pagestyle message through RDM. r=gl, a=RyanVM
authorPatrick Brosset <pbrosset@mozilla.com>
Wed, 12 Dec 2018 16:34:51 +0000
changeset 509091 f77371a128ae6e098e2bd4c482ec705b4eac2b6c
parent 509090 2fe74b55dfcc2a1837af0f5c45b2ce1efd3f97e2
child 509092 da461fa0a394f281b886840bd768f7dc8a1f25d0
push id1905
push userffxbld-merge
push dateMon, 21 Jan 2019 12:33:13 +0000
treeherdermozilla-release@c2fca1944d8c [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersgl, RyanVM
bugs1500921
milestone65.0
Bug 1500921 - Tunnel the pagestyle message through RDM. r=gl, a=RyanVM Differential Revision: https://phabricator.services.mozilla.com/D14256
devtools/client/responsive.html/browser/tunnel.js
devtools/client/responsive.html/test/browser/browser.ini
devtools/client/responsive.html/test/browser/browser_page_style.js
--- a/devtools/client/responsive.html/browser/tunnel.js
+++ b/devtools/client/responsive.html/browser/tunnel.js
@@ -357,16 +357,18 @@ MessageManagerTunnel.prototype = {
 
   OUTER_TO_INNER_MESSAGES: [
     // Messages sent from remote-browser.xml
     "Browser:PurgeSessionHistory",
     "InPermitUnload",
     "PermitUnload",
     // Messages sent from browser.js
     "Browser:Reload",
+    "PageStyle:Disable",
+    "PageStyle:Switch",
     // Messages sent from SelectParentHelper.jsm
     "Forms:DismissedDropDown",
     "Forms:MouseOut",
     "Forms:MouseOver",
     "Forms:SelectDropDownItem",
     // Messages sent from SessionStore.jsm
     "SessionStore:flush",
     "SessionStore:restoreHistory",
@@ -375,16 +377,17 @@ MessageManagerTunnel.prototype = {
 
   INNER_TO_OUTER_MESSAGES: [
     // Messages sent to browser.js
     "Browser:LoadURI",
     "Link:SetIcon",
     "Link:SetFailedIcon",
     "Link:AddFeed",
     "Link:AddSearch",
+    "PageStyle:StyleSheets",
     // Messages sent to RemoteWebProgress.jsm
     "Content:LoadURIResult",
     "Content:LocationChange",
     "Content:ProgressChange",
     "Content:SecurityChange",
     "Content:StateChange",
     "Content:StatusChange",
     // Messages sent to remote-browser.xml
--- a/devtools/client/responsive.html/test/browser/browser.ini
+++ b/devtools/client/responsive.html/test/browser/browser.ini
@@ -42,16 +42,17 @@ tags = devtools webextensions
 [browser_hide_container.js]
 [browser_menu_item_01.js]
 [browser_menu_item_02.js]
 [browser_mouse_resize.js]
 [browser_navigation.js]
 skip-if = true # Bug 1413765
 [browser_network_throttling.js]
 [browser_page_state.js]
+[browser_page_style.js]
 [browser_permission_doorhanger.js]
 tags = devtools geolocation
 skip-if = true # Bug 1413765
 [browser_preloaded_newtab.js]
 [browser_screenshot_button.js]
 [browser_state_restore.js]
 [browser_tab_close.js]
 [browser_tab_remoteness_change.js]
new file mode 100644
--- /dev/null
+++ b/devtools/client/responsive.html/test/browser/browser_page_style.js
@@ -0,0 +1,49 @@
+/* Any copyright is dedicated to the Public Domain.
+http://creativecommons.org/publicdomain/zero/1.0/ */
+
+"use strict";
+
+// Test that the Page Style browser menu actions make it to the viewport, instead of
+// applying to the RDM UI.
+
+const TEST_URL = "data:text/html;charset=utf-8,<style>body{color:red}</style>Hello RDM";
+
+addRDMTask(TEST_URL, async function({ ui, manager }) {
+  // Store the RDM body text color for later.
+  const rdmWindow = ui.toolWindow;
+  const rdmTextColor = rdmWindow.getComputedStyle(rdmWindow.document.body).color;
+
+  info("Trigger the no page style action and wait for the text color to change");
+  let onPageColorChanged = waitForContentPageTextColor(ui, "rgb(0, 0, 0)");
+  let menuItem = document.querySelector("#menu_pageStyleNoStyle");
+  menuItem.click();
+  let color = await onPageColorChanged;
+
+  is(color, "rgb(0, 0, 0)", "The text color is black, so the style was disabled");
+
+  info("Check that the RDM page style wasn't disabled");
+  is(rdmWindow.getComputedStyle(rdmWindow.document.body).color, rdmTextColor,
+     "The color of the text in the RDM window is correct, so that style still applies");
+
+  info("Trigger the page style back and wait for the text color to change again");
+  onPageColorChanged = waitForContentPageTextColor(ui, "rgb(255, 0, 0)");
+  menuItem = document.querySelector("#menu_pageStylePersistentOnly");
+  menuItem.click();
+  color = await onPageColorChanged;
+
+  is(color, "rgb(255, 0, 0)", "The text color is red, so the style was enabled");
+});
+
+function waitForContentPageTextColor(ui, expectedColor) {
+  return ContentTask.spawn(ui.getViewportBrowser(), { expectedColor }, function(args) {
+    return new Promise(resolve => {
+      const interval = content.setInterval(() => {
+        const color = content.getComputedStyle(content.document.body).color;
+        if (color === args.expectedColor) {
+          content.clearInterval(interval);
+          resolve(color);
+        }
+      }, 200);
+    });
+  });
+}