Bug 1237885 - Remove code duplication in new rule checks in ruleview tests; r=jdescottes draft
authorPatrick Brosset <pbrosset@mozilla.com>
Mon, 30 May 2016 12:38:28 +0200
changeset 372842 fba6328cfa4ee6d8085184a49ee123f9ac11966b
parent 372841 209da0735d72b91f07fcc9463b71b8fd4b5cf372
child 372843 ce2d3885ec34c4c1ed591c6d1852889a183fe275
push id19604
push userpbrosset@mozilla.com
push dateMon, 30 May 2016 11:03:14 +0000
reviewersjdescottes
bugs1237885
milestone49.0a1
Bug 1237885 - Remove code duplication in new rule checks in ruleview tests; r=jdescottes MozReview-Commit-ID: 6Qd9AsWWSKQ
devtools/client/inspector/rules/test/browser_rules_add-rule-and-property.js
devtools/client/inspector/rules/test/browser_rules_add-rule_01.js
devtools/client/inspector/rules/test/browser_rules_add-rule_03.js
devtools/client/inspector/rules/test/browser_rules_add-rule_05.js
devtools/client/inspector/rules/test/browser_rules_add-rule_06.js
devtools/client/inspector/rules/test/browser_rules_add-rule_iframes.js
devtools/client/inspector/rules/test/browser_rules_add-rule_pseudo_class.js
devtools/client/inspector/rules/test/head.js
--- a/devtools/client/inspector/rules/test/browser_rules_add-rule-and-property.js
+++ b/devtools/client/inspector/rules/test/browser_rules_add-rule-and-property.js
@@ -9,18 +9,17 @@
 add_task(function* () {
   yield addTab("data:text/html;charset=utf-8,<div id='testid'>Styled Node</div>");
   let {inspector, view} = yield openRuleView();
 
   info("Selecting the test node");
   yield selectNode("#testid", inspector);
 
   info("Adding a new rule for this node and blurring the new selector field");
-  yield addNewRule(inspector, view);
-  EventUtils.synthesizeKey("VK_ESCAPE", {});
+  yield addNewRuleAndDismissEditor(inspector, view, "#testid", 1);
 
   info("Adding a new property for this rule");
   let ruleEditor = getRuleViewRuleEditor(view, 1);
 
   let onRuleViewChanged = view.once("ruleview-changed");
   ruleEditor.addProperty("font-weight", "bold", "");
   yield onRuleViewChanged;
 
--- a/devtools/client/inspector/rules/test/browser_rules_add-rule_01.js
+++ b/devtools/client/inspector/rules/test/browser_rules_add-rule_01.js
@@ -37,24 +37,11 @@ const TEST_DATA = [
 
 add_task(function* () {
   yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
   let {inspector, view} = yield openRuleView();
 
   for (let data of TEST_DATA) {
     let {node, expected} = data;
     yield selectNode(node, inspector);
-    yield addNewRule(inspector, view);
-    yield testNewRule(view, expected);
+    yield addNewRuleAndDismissEditor(inspector, view, expected, 1);
   }
 });
-
-function* testNewRule(view, expected) {
-  let ruleEditor = getRuleViewRuleEditor(view, 1);
-  let editor = ruleEditor.selectorText.ownerDocument.activeElement;
-  is(editor.value, expected, "Selector editor value is as expected: " + expected);
-
-  info("Escaping from the selector inplace editor");
-  EventUtils.synthesizeKey("VK_ESCAPE", {});
-
-  is(ruleEditor.selectorText.textContent, expected,
-     "Selector text value is as expected: " + expected);
-}
--- a/devtools/client/inspector/rules/test/browser_rules_add-rule_03.js
+++ b/devtools/client/inspector/rules/test/browser_rules_add-rule_03.js
@@ -17,46 +17,35 @@ const TEST_URI = `
   <span>This is a span</span>
 `;
 
 add_task(function* () {
   yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
   let {inspector, view} = yield openRuleView();
   yield selectNode("#testid", inspector);
 
-  yield addNewRule(inspector, view);
+  yield addNewRuleAndDismissEditor(inspector, view, "#testid", 1);
 
-  info("Adding new properties to the new rule");
-  yield testNewRule(view, "#testid", 1);
+  info("Adding a new property to the new rule");
+  yield testAddingProperty(view, 1);
 
   info("Editing existing selector field");
   yield testEditSelector(view, "span");
 
   info("Selecting the modified element");
   yield selectNode("span", inspector);
 
   info("Check new rule and property exist in the modified element");
   yield checkModifiedElement(view, "span", 1);
 });
 
-function* testNewRule(view, expected, index) {
-  let idRuleEditor = getRuleViewRuleEditor(view, index);
-  let editor = idRuleEditor.selectorText.ownerDocument.activeElement;
-  is(editor.value, expected,
-      "Selector editor value is as expected: " + expected);
-
-  info("Entering the escape key");
-  EventUtils.synthesizeKey("VK_ESCAPE", {});
-
-  is(idRuleEditor.selectorText.textContent, expected,
-      "Selector text value is as expected: " + expected);
-
-  info("Adding new properties to new rule: " + expected);
-  idRuleEditor.addProperty("font-weight", "bold", "");
-  let textProps = idRuleEditor.rule.textProps;
+function* testAddingProperty(view, index) {
+  let ruleEditor = getRuleViewRuleEditor(view, index);
+  ruleEditor.addProperty("font-weight", "bold", "");
+  let textProps = ruleEditor.rule.textProps;
   let lastRule = textProps[textProps.length - 1];
   is(lastRule.name, "font-weight", "Last rule name is font-weight");
   is(lastRule.value, "bold", "Last rule value is bold");
 }
 
 function* testEditSelector(view, name) {
   let idRuleEditor = getRuleViewRuleEditor(view, 1);
 
--- a/devtools/client/inspector/rules/test/browser_rules_add-rule_05.js
+++ b/devtools/client/inspector/rules/test/browser_rules_add-rule_05.js
@@ -39,34 +39,21 @@ add_task(function* () {
   for (let data of TEST_DATA) {
     let {node, expected} = data;
     yield selectNode(node, inspector);
     yield testNewRule(inspector, view, expected);
   }
 });
 
 function* testNewRule(inspector, view, expected) {
-  info("Adding a new rule and expecting a ruleview-changed event");
-  let onRuleViewChanged = view.once("ruleview-changed");
-  yield addNewRule(inspector, view);
-  yield onRuleViewChanged;
-
-  let ruleEditor = getRuleViewRuleEditor(view, 1);
-  let editor = ruleEditor.selectorText.ownerDocument.activeElement;
-  is(editor.value, expected,
-     "Selector editor value is as expected: " + expected);
-
-  info("Entering the escape key");
-  EventUtils.synthesizeKey("VK_ESCAPE", {});
-
-  is(ruleEditor.selectorText.textContent, expected,
-     "Selector text value is as expected: " + expected);
+  yield addNewRuleAndDismissEditor(inspector, view, expected, 1);
 
   info("Adding new properties to new rule: " + expected);
-  onRuleViewChanged = view.once("ruleview-changed");
+  let ruleEditor = getRuleViewRuleEditor(view, 1);
+  let onRuleViewChanged = view.once("ruleview-changed");
   ruleEditor.addProperty("font-weight", "bold", "");
   yield onRuleViewChanged;
 
   let textProps = ruleEditor.rule.textProps;
   let lastRule = textProps[textProps.length - 1];
   is(lastRule.name, "font-weight", "Last rule name is font-weight");
   is(lastRule.value, "bold", "Last rule value is bold");
 }
--- a/devtools/client/inspector/rules/test/browser_rules_add-rule_06.js
+++ b/devtools/client/inspector/rules/test/browser_rules_add-rule_06.js
@@ -31,19 +31,11 @@ const TEST_DATA = [
 
 add_task(function* () {
   yield addTab(TEST_URI);
   let {inspector, view} = yield openRuleView();
 
   for (let data of TEST_DATA) {
     let {node, expected} = data;
     yield selectNode(node, inspector);
-    yield addNewRule(inspector, view);
-    yield testNewRule(view, expected, 1);
+    yield addNewRuleAndDismissEditor(inspector, view, expected, 1);
   }
 });
-
-function* testNewRule(view, expected, index) {
-  let idRuleEditor = getRuleViewRuleEditor(view, index);
-  let editor = idRuleEditor.selectorText.ownerDocument.activeElement;
-  is(editor.value, expected,
-      "Selector editor value is as expected: " + expected);
-}
--- a/devtools/client/inspector/rules/test/browser_rules_add-rule_iframes.js
+++ b/devtools/client/inspector/rules/test/browser_rules_add-rule_iframes.js
@@ -12,51 +12,31 @@ const TEST_URI =
   </iframe>
   <iframe id="frame2" src="data:text/html;charset=utf-8,<div>inner2</div>">
   </iframe>`;
 
 add_task(function* () {
   yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
   let {inspector, view} = yield openRuleView();
   yield selectNode("div", inspector);
-  yield addNewRule(inspector, view);
-  yield testNewRule(view, "div", 1);
+  yield addNewRuleAndDismissEditor(inspector, view, "div", 1);
   yield addNewProperty(view, 1, "color", "red");
 
   let innerFrameDiv1 = yield getNodeFrontInFrame("div", "#frame1", inspector);
   yield selectNode(innerFrameDiv1, inspector);
-  yield addNewRule(inspector, view);
-  yield testNewRule(view, "div", 1);
+  yield addNewRuleAndDismissEditor(inspector, view, "div", 1);
   yield addNewProperty(view, 1, "color", "blue");
 
   let innerFrameDiv2 = yield getNodeFrontInFrame("div", "#frame2", inspector);
   yield selectNode(innerFrameDiv2, inspector);
-  yield addNewRule(inspector, view);
-  yield testNewRule(view, "div", 1);
+  yield addNewRuleAndDismissEditor(inspector, view, "div", 1);
   yield addNewProperty(view, 1, "color", "green");
 });
 
 /**
- * Check the newly created rule has the expected selector and submit the
- * selector editor.
- */
-function* testNewRule(view, expected, index) {
-  let idRuleEditor = getRuleViewRuleEditor(view, index);
-  let editor = idRuleEditor.selectorText.ownerDocument.activeElement;
-  is(editor.value, expected,
-      "Selector editor value is as expected: " + expected);
-
-  info("Entering the escape key");
-  EventUtils.synthesizeKey("VK_ESCAPE", {});
-
-  is(idRuleEditor.selectorText.textContent, expected,
-      "Selector text value is as expected: " + expected);
-}
-
-/**
  * Add a new property in the rule at the provided index in the rule view.
  *
  * @param {RuleView} view
  * @param {Number} index
  *        The index of the rule in which we should add a new property.
  * @param {String} name
  *        The name of the new property.
  * @param {String} value
--- a/devtools/client/inspector/rules/test/browser_rules_add-rule_pseudo_class.js
+++ b/devtools/client/inspector/rules/test/browser_rules_add-rule_pseudo_class.js
@@ -26,34 +26,21 @@ add_task(function* () {
 
   for (let data of TEST_DATA) {
     yield runTestData(inspector, view, data);
   }
 });
 
 function* runTestData(inspector, view, pseudoClasses) {
   yield setPseudoLocks(inspector, view, pseudoClasses);
-  yield addNewRule(inspector, view);
-  yield testNewRule(view, pseudoClasses, 1);
-  yield resetPseudoLocks(inspector, view);
-}
 
-function* testNewRule(view, pseudoClasses, index) {
-  let idRuleEditor = getRuleViewRuleEditor(view, index);
-  let editor = idRuleEditor.selectorText.ownerDocument.activeElement;
   let expected = EXPECTED_SELECTOR + pseudoClasses.join("");
-
-  is(editor.value, expected,
-      "Selector editor value is as expected: " + expected);
+  yield addNewRuleAndDismissEditor(inspector, view, expected, 1);
 
-  info("Entering the escape key");
-  EventUtils.synthesizeKey("VK_ESCAPE", {});
-
-  is(idRuleEditor.selectorText.textContent, expected,
-      "Selector text value is as expected: " + expected);
+  yield resetPseudoLocks(inspector, view);
 }
 
 function* setPseudoLocks(inspector, view, pseudoClasses) {
   if (pseudoClasses.length == 0) {
     return;
   }
 
   for (let pseudoClass of pseudoClasses) {
--- a/devtools/client/inspector/rules/test/head.js
+++ b/devtools/client/inspector/rules/test/head.js
@@ -728,32 +728,63 @@ function* reloadPage(inspector, testActo
   let onNewRoot = inspector.once("new-root");
   yield testActor.reload();
   yield onNewRoot;
   yield inspector.markup._waitForChildren();
 }
 
 /**
  * Create a new rule by clicking on the "add rule" button.
+ * This will leave the selector inplace-editor active.
  *
  * @param {InspectorPanel} inspector
  *        The instance of InspectorPanel currently loaded in the toolbox
  * @param {CssRuleView} view
  *        The instance of the rule-view panel
  * @return a promise that resolves after the rule has been added
  */
 function* addNewRule(inspector, view) {
   info("Adding the new rule using the button");
   view.addRuleButton.click();
 
   info("Waiting for rule view to change");
   yield view.once("ruleview-changed");
 }
 
 /**
+ * Create a new rule by clicking on the "add rule" button, dismiss the editor field and
+ * verify that the selector is correct.
+ *
+ * @param {InspectorPanel} inspector
+ *        The instance of InspectorPanel currently loaded in the toolbox
+ * @param {CssRuleView} view
+ *        The instance of the rule-view panel
+ * @param {String} expectedSelector
+ *        The value we expect the selector to have
+ * @param {Number} expectedIndex
+ *        The index we expect the rule to have in the rule-view
+ * @return a promise that resolves after the rule has been added
+ */
+function* addNewRuleAndDismissEditor(inspector, view, expectedSelector, expectedIndex) {
+  yield addNewRule(inspector, view);
+
+  info("Getting the new rule at index " + expectedIndex);
+  let ruleEditor = getRuleViewRuleEditor(view, expectedIndex);
+  let editor = ruleEditor.selectorText.ownerDocument.activeElement;
+  is(editor.value, expectedSelector,
+     "The editor for the new selector has the correct value: " + expectedSelector);
+
+  info("Pressing escape to leave the editor");
+  EventUtils.synthesizeKey("VK_ESCAPE", {});
+
+  is(ruleEditor.selectorText.textContent, expectedSelector,
+     "The new selector has the correct text: " + expectedSelector);
+}
+
+/**
  * Simulate a sequence of non-character keys (return, escape, tab) and wait for
  * a given element to receive the focus.
  *
  * @param {CssRuleView} view
  *        The instance of the rule-view panel
  * @param {DOMNode} element
  *        The element that should be focused
  * @param {Array} keys