Bug 1246677 - 2 - Stop using CPOWs in simulateColorPickerChange; r=miker
authorPatrick Brosset <pbrosset@mozilla.com>
Mon, 08 Feb 2016 18:02:35 +0100
changeset 322057 537780e69e137441fcdee0f9b78e4a469791379a
parent 322056 1b01060ee64a77995c4966a68046d3a09aec55c4
child 322058 6dc5b034b6c7031889d01b5bc01641e38f250221
push id5913
push userjlund@mozilla.com
push dateMon, 25 Apr 2016 16:57:49 +0000
treeherdermozilla-beta@dcaf0a6fa115 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersmiker
bugs1246677
milestone47.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1246677 - 2 - Stop using CPOWs in simulateColorPickerChange; r=miker MozReview-Commit-ID: 6jGUGfD0bM5
devtools/client/inspector/rules/test/browser_rules_authored_color.js
devtools/client/inspector/rules/test/browser_rules_colorUnit.js
devtools/client/inspector/rules/test/browser_rules_colorpicker-and-image-tooltip_01.js
devtools/client/inspector/rules/test/browser_rules_colorpicker-and-image-tooltip_02.js
devtools/client/inspector/rules/test/browser_rules_colorpicker-commit-on-ENTER.js
devtools/client/inspector/rules/test/browser_rules_colorpicker-edit-gradient.js
devtools/client/inspector/rules/test/browser_rules_colorpicker-multiple-changes.js
devtools/client/inspector/rules/test/browser_rules_colorpicker-revert-on-ESC.js
devtools/client/inspector/rules/test/head.js
--- a/devtools/client/inspector/rules/test/browser_rules_authored_color.js
+++ b/devtools/client/inspector/rules/test/browser_rules_authored_color.js
@@ -36,20 +36,18 @@ add_task(function* () {
 
     let cPicker = view.tooltips.colorPicker;
     let swatch = getRuleViewProperty(view, "#testid", "color").valueSpan
         .querySelector(".ruleview-colorswatch");
     let onShown = cPicker.tooltip.once("shown");
     swatch.click();
     yield onShown;
 
-    let testNode = getNode("#testid");
-
     yield simulateColorPickerChange(view, cPicker, [0, 255, 0, 1], {
-      element: testNode,
+      selector: "#testid",
       name: "color",
       value: "rgb(0, 255, 0)"
     });
 
     let spectrum = yield cPicker.spectrum;
     let onHidden = cPicker.tooltip.once("hidden");
     // Validating the color change ends up updating the rule view twice
     let onRuleViewChanged = waitForNEvents(view, "ruleview-changed", 2);
--- a/devtools/client/inspector/rules/test/browser_rules_colorUnit.js
+++ b/devtools/client/inspector/rules/test/browser_rules_colorUnit.js
@@ -41,20 +41,18 @@ add_task(function*() {
 function* basicTest(view, name, result) {
   let cPicker = view.tooltips.colorPicker;
   let swatch = getRuleViewProperty(view, "#testid", "color").valueSpan
       .querySelector(".ruleview-colorswatch");
   let onShown = cPicker.tooltip.once("shown");
   swatch.click();
   yield onShown;
 
-  let testNode = getNode("#testid");
-
   yield simulateColorPickerChange(view, cPicker, [0, 255, 0, 1], {
-    element: testNode,
+    selector: "#testid",
     name: "color",
     value: "rgb(0, 255, 0)"
   });
 
   let spectrum = yield cPicker.spectrum;
   let onHidden = cPicker.tooltip.once("hidden");
   // Validating the color change ends up updating the rule view twice
   let onRuleViewChanged = waitForNEvents(view, "ruleview-changed", 2);
--- a/devtools/client/inspector/rules/test/browser_rules_colorpicker-and-image-tooltip_01.js
+++ b/devtools/client/inspector/rules/test/browser_rules_colorpicker-and-image-tooltip_01.js
@@ -34,18 +34,18 @@ function* testImageTooltipAfterColorChan
   is(anchor, url, "The anchor returned by the showOnHover callback is correct");
 
   info("Open the color picker tooltip and change the color");
   let picker = ruleView.tooltips.colorPicker;
   let onShown = picker.tooltip.once("shown");
   swatch.click();
   yield onShown;
   yield simulateColorPickerChange(ruleView, picker, [0, 0, 0, 1], {
-    element: content.document.body,
-    name: "backgroundImage",
+    selector: "body",
+    name: "background-image",
     value: 'url("chrome://global/skin/icons/warning-64.png"), linear-gradient(rgb(0, 0, 0), rgb(255, 0, 102) 400px)'
   });
 
   let spectrum = yield picker.spectrum;
   let onHidden = picker.tooltip.once("hidden");
   let onModifications = ruleView.once("ruleview-changed");
   EventUtils.sendKey("RETURN", spectrum.element.ownerDocument.defaultView);
   yield onHidden;
--- a/devtools/client/inspector/rules/test/browser_rules_colorpicker-and-image-tooltip_02.js
+++ b/devtools/client/inspector/rules/test/browser_rules_colorpicker-and-image-tooltip_02.js
@@ -36,18 +36,18 @@ function* testColorChangeIsntRevertedWhe
 
   info("Open the color picker tooltip and change the color");
   let picker = ruleView.tooltips.colorPicker;
   let onShown = picker.tooltip.once("shown");
   swatch.click();
   yield onShown;
 
   yield simulateColorPickerChange(ruleView, picker, [0, 0, 0, 1], {
-    element: content.document.body,
-    name: "backgroundColor",
+    selector: "body",
+    name: "background-color",
     value: "rgb(0, 0, 0)"
   });
 
   let spectrum = yield picker.spectrum;
   let onModifications = ruleView.once("ruleview-changed");
   let onHidden = picker.tooltip.once("hidden");
   EventUtils.sendKey("RETURN", spectrum.element.ownerDocument.defaultView);
   yield onHidden;
--- a/devtools/client/inspector/rules/test/browser_rules_colorpicker-commit-on-ENTER.js
+++ b/devtools/client/inspector/rules/test/browser_rules_colorpicker-commit-on-ENTER.js
@@ -28,18 +28,18 @@ add_task(function*() {
 function* testPressingEnterCommitsChanges(swatch, ruleView) {
   let cPicker = ruleView.tooltips.colorPicker;
 
   let onShown = cPicker.tooltip.once("shown");
   swatch.click();
   yield onShown;
 
   yield simulateColorPickerChange(ruleView, cPicker, [0, 255, 0, .5], {
-    element: content.document.body,
-    name: "borderLeftColor",
+    selector: "body",
+    name: "border-left-color",
     value: "rgba(0, 255, 0, 0.5)"
   });
 
   is(swatch.style.backgroundColor, "rgba(0, 255, 0, 0.5)",
     "The color swatch's background was updated");
   is(getRuleViewProperty(ruleView, "body", "border").valueSpan.textContent,
     "2em solid rgba(0, 255, 0, 0.5)",
     "The text of the border css property was updated");
--- a/devtools/client/inspector/rules/test/browser_rules_colorpicker-edit-gradient.js
+++ b/devtools/client/inspector/rules/test/browser_rules_colorpicker-edit-gradient.js
@@ -53,18 +53,18 @@ function* testPickingNewColor(view) {
 
   info("Getting the color picker tooltip and clicking on the swatch to show it");
   let cPicker = view.tooltips.colorPicker;
   let onShown = cPicker.tooltip.once("shown");
   swatchEl.click();
   yield onShown;
 
   let change = {
-    element: content.document.body,
-    name: "backgroundImage",
+    selector: "body",
+    name: "background-image",
     value: "linear-gradient(to left, rgb(1, 1, 1) 25%, rgb(51, 51, 51) 95%, rgb(0, 0, 0) 100%)"
   };
   yield simulateColorPickerChange(view, cPicker, [1, 1, 1, 1], change);
 
   is(swatchEl.style.backgroundColor, "rgb(1, 1, 1)",
     "The color swatch's background was updated");
   is(colorEl.textContent, "#010101", "The color text was updated");
   is(content.getComputedStyle(content.document.body).backgroundImage,
--- a/devtools/client/inspector/rules/test/browser_rules_colorpicker-multiple-changes.js
+++ b/devtools/client/inspector/rules/test/browser_rules_colorpicker-multiple-changes.js
@@ -50,17 +50,17 @@ function* testSimpleMultipleColorChanges
   info("Changing the color several times");
   let colors = [
     {rgba: [0, 0, 0, 1], computed: "rgb(0, 0, 0)"},
     {rgba: [100, 100, 100, 1], computed: "rgb(100, 100, 100)"},
     {rgba: [200, 200, 200, 1], computed: "rgb(200, 200, 200)"}
   ];
   for (let {rgba, computed} of colors) {
     yield simulateColorPickerChange(ruleView, picker, rgba, {
-      element: content.document.querySelector("p"),
+      selector: "p",
       name: "color",
       value: computed
     });
   }
 }
 
 function* testComplexMultipleColorChanges(inspector, ruleView) {
   yield selectNode("body", inspector);
@@ -78,18 +78,18 @@ function* testComplexMultipleColorChange
   info("Changing the color several times");
   let colors = [
     {rgba: [0, 0, 0, 1], computed: "rgb(0, 0, 0)"},
     {rgba: [100, 100, 100, 1], computed: "rgb(100, 100, 100)"},
     {rgba: [200, 200, 200, 1], computed: "rgb(200, 200, 200)"}
   ];
   for (let {rgba, computed} of colors) {
     yield simulateColorPickerChange(ruleView, picker, rgba, {
-      element: content.document.body,
-      name: "backgroundColor",
+      selector: "body",
+      name: "background-color",
       value: computed
     });
   }
 
   info("Closing the color picker");
   yield hideTooltipAndWaitForRuleViewChanged(picker.tooltip, ruleView);
 }
 
@@ -109,16 +109,16 @@ function* testOverriddenMultipleColorCha
   info("Changing the color several times");
   let colors = [
     {rgba: [0, 0, 0, 1], computed: "rgb(0, 0, 0)"},
     {rgba: [100, 100, 100, 1], computed: "rgb(100, 100, 100)"},
     {rgba: [200, 200, 200, 1], computed: "rgb(200, 200, 200)"}
   ];
   for (let {rgba, computed} of colors) {
     yield simulateColorPickerChange(ruleView, picker, rgba, {
-      element: content.document.body,
+      selector: "body",
       name: "color",
       value: computed
     });
     is(content.getComputedStyle(content.document.querySelector("p")).color,
       "rgb(200, 200, 200)", "The color of the P tag is still correct");
   }
 }
--- a/devtools/client/inspector/rules/test/browser_rules_colorpicker-revert-on-ESC.js
+++ b/devtools/client/inspector/rules/test/browser_rules_colorpicker-revert-on-ESC.js
@@ -28,18 +28,18 @@ function* testPressingEscapeRevertsChang
   let swatch = propEditor.valueSpan.querySelector(".ruleview-colorswatch");
   let cPicker = view.tooltips.colorPicker;
 
   let onShown = cPicker.tooltip.once("shown");
   swatch.click();
   yield onShown;
 
   yield simulateColorPickerChange(view, cPicker, [0, 0, 0, 1], {
-    element: content.document.body,
-    name: "backgroundColor",
+    selector: "body",
+    name: "background-color",
     value: "rgb(0, 0, 0)"
   });
 
   is(swatch.style.backgroundColor, "rgb(0, 0, 0)",
     "The color swatch's background was updated");
   is(propEditor.valueSpan.textContent, "#000",
     "The text of the background-color css property was updated");
 
--- a/devtools/client/inspector/rules/test/head.js
+++ b/devtools/client/inspector/rules/test/head.js
@@ -500,18 +500,18 @@ function getRuleViewSelectorHighlighterI
  *
  * @param {RuleView} ruleView
  *        The related rule view instance
  * @param {SwatchColorPickerTooltip} colorPicker
  * @param {Array} newRgba
  *        The new color to be set [r, g, b, a]
  * @param {Object} expectedChange
  *        Optional object that needs the following props:
- *          - {DOMNode} element The element in the page that will have its
- *            style changed.
+ *          - {String} selector The selector to the element in the page that
+ *            will have its style changed.
  *          - {String} name The style name that will be changed
  *          - {String} value The expected style value
  * The style will be checked like so: getComputedStyle(element)[name] === value
  */
 var simulateColorPickerChange = Task.async(function*(ruleView, colorPicker,
     newRgba, expectedChange) {
   let onRuleViewChanged = ruleView.once("ruleview-changed");
   info("Getting the spectrum colorpicker object");
@@ -522,20 +522,19 @@ var simulateColorPickerChange = Task.asy
   spectrum.updateUI();
   spectrum.onChange();
   info("Waiting for rule-view to update");
   yield onRuleViewChanged;
 
   if (expectedChange) {
     info("Waiting for the style to be applied on the page");
     yield waitForSuccess(function*() {
-      let {element, name, value} = expectedChange;
-      yield getComputedStyleProperty(selector, null, name)
-      return content.getComputedStyle(element)[name] === value;
-    }, "Color picker change applied on the page");
+      let {selector, name, value} = expectedChange;
+      return (yield getComputedStyleProperty(selector, null, name)) === value;
+    }, `Color picker change applied on element "${expectedChange.selector}"`);
   }
 });
 
 /**
  * Get a rule-link from the rule-view given its index
  *
  * @param {CssRuleView} view
  *        The instance of the rule-view panel