Bug 1143742 - part1: multiline inplace editor: cleanup existing tests;r=gl draft
authorJulian Descottes <jdescottes@mozilla.com>
Wed, 02 Mar 2016 17:11:09 +0100
changeset 346094 c8539010d016362d34315d62087790619edc4942
parent 346005 34fabc54b7a4ad90dade559d0678a1a1ddc21536
child 346095 8bbc2e60c9e6f0e6e915b3f0ee42a10b4655b59a
child 346098 f2d36f113fb2af30050576b0b4a79bca4016e076
push id14239
push userjdescottes@mozilla.com
push dateWed, 30 Mar 2016 22:55:01 +0000
reviewersgl
bugs1143742
milestone48.0a1
Bug 1143742 - part1: multiline inplace editor: cleanup existing tests;r=gl In preparation for using a multiline editor for property values, tests need to be updated : - some tests used the "input" selector, which will no longer work with a textarea - some tests are relying on EventUtils.sendChar to send keys such as "VK_RETURN". Doing so also applies the shift key modifier, which has a specific behavior with multiline editors MozReview-Commit-ID: HkFxH3Go49E
devtools/client/inspector/rules/test/browser_rules_edit-property-cancel.js
devtools/client/inspector/rules/test/browser_rules_edit-property-click.js
devtools/client/inspector/rules/test/browser_rules_edit-property_03.js
devtools/client/inspector/rules/test/browser_rules_multiple-properties-unfinished_02.js
devtools/client/inspector/rules/test/head.js
--- a/devtools/client/inspector/rules/test/browser_rules_edit-property-cancel.js
+++ b/devtools/client/inspector/rules/test/browser_rules_edit-property-cancel.js
@@ -20,35 +20,27 @@ add_task(function*() {
   yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
   let {inspector, view} = yield openRuleView();
   yield selectNode("#testid", inspector);
 
   let ruleEditor = getRuleViewRuleEditor(view, 1);
   let propEditor = ruleEditor.rule.textProps[0].editor;
 
   yield focusEditableField(view, propEditor.nameSpan);
-  yield sendCharsAndWaitForFocus(view, ruleEditor.element,
-    ["VK_DELETE", "VK_ESCAPE"]);
+  yield sendKeysAndWaitForFocus(view, ruleEditor.element,
+    ["DELETE", "ESCAPE"]);
 
   is(propEditor.nameSpan.textContent, "background-color",
     "'background-color' property name is correctly set.");
   is((yield getComputedStyleProperty("#testid", null, "background-color")),
     "rgb(0, 0, 255)", "#00F background color is set.");
 
   yield focusEditableField(view, propEditor.valueSpan);
   let onValueDeleted = view.once("ruleview-changed");
-  yield sendCharsAndWaitForFocus(view, ruleEditor.element,
-    ["VK_DELETE", "VK_ESCAPE"]);
+  yield sendKeysAndWaitForFocus(view, ruleEditor.element,
+    ["DELETE", "ESCAPE"]);
   yield onValueDeleted;
 
   is(propEditor.valueSpan.textContent, "#00F",
     "'#00F' property value is correctly set.");
   is((yield getComputedStyleProperty("#testid", null, "background-color")),
     "rgb(0, 0, 255)", "#00F background color is set.");
 });
-
-function* sendCharsAndWaitForFocus(view, element, chars) {
-  let onFocus = once(element, "focus", true);
-  for (let ch of chars) {
-    EventUtils.sendChar(ch, view.styleWindow);
-  }
-  yield onFocus;
-}
--- a/devtools/client/inspector/rules/test/browser_rules_edit-property-click.js
+++ b/devtools/client/inspector/rules/test/browser_rules_edit-property-click.js
@@ -25,45 +25,37 @@ add_task(function*() {
 
 function* testEditPropertyAndCancel(inspector, view) {
   let ruleEditor = getRuleViewRuleEditor(view, 1);
   let propEditor = ruleEditor.rule.textProps[0].editor;
 
   info("Test editor is created when clicking on property name");
   yield focusEditableField(view, propEditor.nameSpan);
   ok(propEditor.nameSpan.inplaceEditor, "Editor created for property name");
-  yield sendCharsAndWaitForFocus(view, ruleEditor.element, ["VK_ESCAPE"]);
+  yield sendKeysAndWaitForFocus(view, ruleEditor.element, ["ESCAPE"]);
 
   info("Test editor is created when clicking on ':' next to property name");
   let nameRect = propEditor.nameSpan.getBoundingClientRect();
   yield focusEditableField(view, propEditor.nameSpan, nameRect.width + 1);
   ok(propEditor.nameSpan.inplaceEditor, "Editor created for property name");
-  yield sendCharsAndWaitForFocus(view, ruleEditor.element, ["VK_ESCAPE"]);
+  yield sendKeysAndWaitForFocus(view, ruleEditor.element, ["ESCAPE"]);
 
   info("Test editor is created when clicking on property value");
   yield focusEditableField(view, propEditor.valueSpan);
   ok(propEditor.valueSpan.inplaceEditor, "Editor created for property value");
   // When cancelling a value edition, the text-property-editor will trigger
   // a modification to make sure the property is back to its original value
   // => need to wait on "ruleview-changed" to avoid unhandled promises
   let onRuleviewChanged = view.once("ruleview-changed");
-  yield sendCharsAndWaitForFocus(view, ruleEditor.element, ["VK_ESCAPE"]);
+  yield sendKeysAndWaitForFocus(view, ruleEditor.element, ["ESCAPE"]);
   yield onRuleviewChanged;
 
   info("Test editor is created when clicking on ';' next to property value");
   let valueRect = propEditor.valueSpan.getBoundingClientRect();
   yield focusEditableField(view, propEditor.valueSpan, valueRect.width + 1);
   ok(propEditor.valueSpan.inplaceEditor, "Editor created for property value");
   // When cancelling a value edition, the text-property-editor will trigger
   // a modification to make sure the property is back to its original value
   // => need to wait on "ruleview-changed" to avoid unhandled promises
   onRuleviewChanged = view.once("ruleview-changed");
-  yield sendCharsAndWaitForFocus(view, ruleEditor.element, ["VK_ESCAPE"]);
+  yield sendKeysAndWaitForFocus(view, ruleEditor.element, ["ESCAPE"]);
   yield onRuleviewChanged;
 }
-
-function* sendCharsAndWaitForFocus(view, element, chars) {
-  let onFocus = once(element, "focus", true);
-  for (let ch of chars) {
-    EventUtils.sendChar(ch, view.styleWindow);
-  }
-  yield onFocus;
-}
--- a/devtools/client/inspector/rules/test/browser_rules_edit-property_03.js
+++ b/devtools/client/inspector/rules/test/browser_rules_edit-property_03.js
@@ -29,30 +29,22 @@ add_task(function*() {
 
   let ruleEditor = getRuleViewRuleEditor(view, 1);
   let propEditor = ruleEditor.rule.textProps[1].editor;
 
   yield focusEditableField(view, propEditor.valueSpan);
 
   info("Deleting all the text out of a value field");
   let onRuleViewChanged = view.once("ruleview-changed");
-  yield sendCharsAndWaitForFocus(view, ruleEditor.element,
-    ["VK_DELETE", "VK_RETURN"]);
+  yield sendKeysAndWaitForFocus(view, ruleEditor.element,
+    ["DELETE", "RETURN"]);
   yield onRuleViewChanged;
 
   info("Pressing enter a couple times to cycle through editors");
-  yield sendCharsAndWaitForFocus(view, ruleEditor.element, ["VK_RETURN"]);
+  yield sendKeysAndWaitForFocus(view, ruleEditor.element, ["RETURN"]);
   onRuleViewChanged = view.once("ruleview-changed");
-  yield sendCharsAndWaitForFocus(view, ruleEditor.element, ["VK_RETURN"]);
+  yield sendKeysAndWaitForFocus(view, ruleEditor.element, ["RETURN"]);
   yield onRuleViewChanged;
 
   isnot(ruleEditor.rule.textProps[1].editor.nameSpan.style.display, "none",
     "The name span is visible");
   is(ruleEditor.rule.textProps.length, 2, "Correct number of props");
 });
-
-function* sendCharsAndWaitForFocus(view, element, chars) {
-  let onFocus = once(element, "focus", true);
-  for (let ch of chars) {
-    EventUtils.sendChar(ch, element.ownerDocument.defaultView);
-  }
-  yield onFocus;
-}
--- a/devtools/client/inspector/rules/test/browser_rules_multiple-properties-unfinished_02.js
+++ b/devtools/client/inspector/rules/test/browser_rules_multiple-properties-unfinished_02.js
@@ -27,17 +27,18 @@ add_task(function*() {
   is(ruleEditor.rule.textProps.length, 2,
     "Should have created a new text property.");
   is(ruleEditor.propertyList.children.length, 2,
     "Should have created a property editor.");
 
   // Value is focused, lets add multiple rules here and make sure they get added
   onMutation = inspector.once("markupmutation");
   onRuleViewChanged = view.once("ruleview-changed");
-  let valueEditor = ruleEditor.propertyList.children[1].querySelector("input");
+  let valueEditor = ruleEditor.propertyList.children[1].
+    querySelector(".styleinspector-propertyeditor");
   valueEditor.value = "10px;background:orangered;color: black;";
   EventUtils.synthesizeKey("VK_RETURN", {}, view.styleWindow);
   yield onMutation;
   yield onRuleViewChanged;
 
   is(ruleEditor.rule.textProps.length, 4,
     "Should have added the changed value.");
   is(ruleEditor.propertyList.children.length, 5,
--- a/devtools/client/inspector/rules/test/head.js
+++ b/devtools/client/inspector/rules/test/head.js
@@ -872,8 +872,29 @@ function* reloadPage(inspector, testActo
  */
 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");
 }
+
+/**
+ * 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
+ *        Array of non-character keys, the part that comes after "DOM_VK_" eg.
+ *        "RETURN", "ESCAPE"
+ * @return a promise that resolves after the element received the focus
+ */
+function* sendKeysAndWaitForFocus(view, element, keys) {
+  let onFocus = once(element, "focus", true);
+  for (let key of keys) {
+    EventUtils.sendKey(key, view.styleWindow);
+  }
+  yield onFocus;
+}