Bug 1187443 - [Rule View] Remove preview value on start editing of a property r=bgrins

browser/devtools/styleinspector/rule-view.js

@@ -3163,7 +3163,8 @@ TextPropertyEditor.prototype = {
   },
 
   _onStartEditing: function() {
-    this._previewValue(this.prop.value);
+    this.element.classList.remove("ruleview-overridden");
+    this.enable.style.visibility = "hidden";
   },
 
   /**
@@ -3468,9 +3469,6 @@ TextPropertyEditor.prototype = {
       return;
     }
 
-    this.element.classList.remove("ruleview-overridden");
-    this.enable.style.visibility = "hidden";
-
     let val = parseSingleValue(aValue);
     this.ruleEditor.rule.previewPropertyValue(this.prop, val.value,
                                               val.priority);

browser/devtools/styleinspector/test/browser_ruleview_edit-property_04.js

@@ -4,8 +4,7 @@
 
 "use strict";
 
-// Tests that a disabled property is previewed when the property name or value
-// editor is focused and the property remains disabled when the escaping out of
+// Tests that a disabled property remains disabled when the escaping out of
 // the property editor.
 
 let TEST_URI = [
@@ -39,20 +38,19 @@ function* testDisableProperty(inspector, view) {
   });
   is(newValue, "", "background-color should have been unset.");
 
-  yield testPreviewDisableProperty(view, ruleEditor, propEditor,
+  yield testEditDisableProperty(view, ruleEditor, propEditor,
     propEditor.nameSpan, "VK_ESCAPE");
-  yield testPreviewDisableProperty(view, ruleEditor, propEditor,
+  yield testEditDisableProperty(view, ruleEditor, propEditor,
     propEditor.valueSpan, "VK_ESCAPE");
-  yield testPreviewDisableProperty(view, ruleEditor, propEditor,
+  yield testEditDisableProperty(view, ruleEditor, propEditor,
     propEditor.valueSpan, "VK_TAB");
-  yield testPreviewDisableProperty(view, ruleEditor, propEditor,
+  yield testEditDisableProperty(view, ruleEditor, propEditor,
     propEditor.valueSpan, "VK_RETURN");
 }
 
-function* testPreviewDisableProperty(view, ruleEditor, propEditor,
+function* testEditDisableProperty(view, ruleEditor, propEditor,
     editableField, commitKey) {
   let editor = yield focusEditableField(view, editableField);
-  yield ruleEditor.rule._applyingModifications;
 
   ok(!propEditor.element.classList.contains("ruleview-overridden"),
     "property is not overridden.");
@@ -64,7 +62,7 @@ function* testPreviewDisableProperty(view, ruleEditor, propEditor,
     ruleIndex: 0,
     name: "background-color"
   });
-  is(newValue, "blue", "background-color should have been previewed.");
+  is(newValue, "", "background-color should remain unset.");
 
   let onBlur = once(editor.input, "blur");
   EventUtils.synthesizeKey(commitKey, {}, view.styleWindow);
@@ -84,5 +82,5 @@ function* testPreviewDisableProperty(view, ruleEditor, propEditor,
     ruleIndex: 0,
     name: "background-color"
   });
-  is(newValue, "", "background-color should have been unset.");
+  is(newValue, "", "background-color should remain unset.");
 }

browser/devtools/styleinspector/test/browser_ruleview_multiple-properties-unfinished_01.js

@@ -36,9 +36,9 @@ function waitRuleViewChanged(view, n) {
 }
 function* testCreateNewMultiUnfinished(inspector, ruleEditor, view) {
   let onMutation = inspector.once("markupmutation");
-  // There is 6 rule-view updates, one for the rule view creation,
-  // one for each new property and one last for throttle update.
-  let onRuleViewChanged = waitRuleViewChanged(view, 6);
+  // There is 5 rule-view updates, one for the rule view creation,
+  // one for each new property
+  let onRuleViewChanged = waitRuleViewChanged(view, 5);
   yield createNewRuleViewProperty(ruleEditor,
     "color:blue;background : orange   ; text-align:center; border-color: ");
   yield onMutation;

browser/devtools/styleinspector/test/head.js

@@ -414,29 +414,15 @@ function* waitForComputedStyleProperty(selector, pseudo, name, expected) {
  * @return a promise that resolves to the inplace-editor element when ready
  */
 let focusEditableField = Task.async(function*(ruleView, editable, xOffset=1, yOffset=1, options={}) {
-  // Focusing the name or value input is going to fire a preview and update the rule view
-  let expectRuleViewUpdate =
-    editable.classList.contains("ruleview-propertyname") ||
-    editable.classList.contains("ruleview-propertyvalue");
-  let onRuleViewChanged;
-  if (expectRuleViewUpdate) {
-    onRuleViewChanged = ruleView.once("ruleview-changed");
-  }
-
   let onFocus = once(editable.parentNode, "focus", true);
   info("Clicking on editable field to turn to edit mode");
   EventUtils.synthesizeMouse(editable, xOffset, yOffset, options,
     editable.ownerDocument.defaultView);
-  let event = yield onFocus;
+  yield onFocus;
 
   info("Editable field gained focus, returning the input field now");
   let onEdit = inplaceEditor(editable.ownerDocument.activeElement);
 
-  if (expectRuleViewUpdate) {
-    info("Waiting for rule view update");
-    yield onRuleViewChanged;
-  }
-
   return onEdit;
 });