Web Inspector: Styles: inline swatches don't work when Multiple Properties Selection...
authornvasilyev@apple.com <nvasilyev@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Tue, 13 Nov 2018 04:43:41 +0000 (04:43 +0000)
committernvasilyev@apple.com <nvasilyev@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Tue, 13 Nov 2018 04:43:41 +0000 (04:43 +0000)
https://bugs.webkit.org/show_bug.cgi?id=191165
<rdar://problem/45737972>

Reviewed by Devin Rousso.

* UserInterface/Views/SpreadsheetStyleProperty.js:
(WI.SpreadsheetStyleProperty.prototype._createInlineSwatch):
* UserInterface/Views/SpreadsheetTextField.js:
(WI.SpreadsheetTextField):
`click` is fired after `mouseup` and inline swatches are activated by `click` event.
Changing this to `click` allows swatches to activate before editing starts.

(WI.SpreadsheetTextField.prototype._handleMouseDown):
Clicking on the field that is being edited should't restart editing. It should move the text caret.

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@238120 268f45cc-cd09-0410-ab3c-d52691b4dbfc

Source/WebInspectorUI/ChangeLog
Source/WebInspectorUI/UserInterface/Views/SpreadsheetStyleProperty.js
Source/WebInspectorUI/UserInterface/Views/SpreadsheetTextField.js

index 412c488..f715ebf 100644 (file)
@@ -1,3 +1,21 @@
+2018-11-12  Nikita Vasilyev  <nvasilyev@apple.com>
+
+        Web Inspector: Styles: inline swatches don't work when Multiple Properties Selection is enabled
+        https://bugs.webkit.org/show_bug.cgi?id=191165
+        <rdar://problem/45737972>
+
+        Reviewed by Devin Rousso.
+
+        * UserInterface/Views/SpreadsheetStyleProperty.js:
+        (WI.SpreadsheetStyleProperty.prototype._createInlineSwatch):
+        * UserInterface/Views/SpreadsheetTextField.js:
+        (WI.SpreadsheetTextField):
+        `click` is fired after `mouseup` and inline swatches are activated by `click` event.
+        Changing this to `click` allows swatches to activate before editing starts.
+
+        (WI.SpreadsheetTextField.prototype._handleMouseDown):
+        Clicking on the field that is being edited should't restart editing. It should move the text caret.
+
 2018-11-12  Don Olmstead  <don.olmstead@sony.com>
 
         Shipped PNGs include bad profiles: iCCP: known incorrect sRGB profile
index f4b35cb..dd418f5 100644 (file)
@@ -452,12 +452,14 @@ WI.SpreadsheetStyleProperty = class SpreadsheetStyleProperty extends WI.Object
 
         if (typeof this._delegate.stylePropertyInlineSwatchActivated === "function") {
             swatch.addEventListener(WI.InlineSwatch.Event.Activated, () => {
+                this._swatchActive = true;
                 this._delegate.stylePropertyInlineSwatchActivated();
             });
         }
 
         if (typeof this._delegate.stylePropertyInlineSwatchDeactivated === "function") {
             swatch.addEventListener(WI.InlineSwatch.Event.Deactivated, () => {
+                this._swatchActive = false;
                 this._delegate.stylePropertyInlineSwatchDeactivated();
             });
         }
@@ -465,7 +467,13 @@ WI.SpreadsheetStyleProperty = class SpreadsheetStyleProperty extends WI.Object
         tokenElement.append(swatch.element, innerElement);
 
         // Prevent the value from editing when clicking on the swatch.
-        swatch.element.addEventListener("mousedown", (event) => { event.stop(); });
+        if (WI.settings.experimentalEnableMultiplePropertiesSelection.value) {
+            swatch.element.addEventListener("click", (event) => {
+                if (this._swatchActive)
+                    event.stop();
+            });
+        } else
+            swatch.element.addEventListener("mousedown", (event) => { event.stop(); });
 
         return tokenElement;
     }
index 9c9a9f3..ea432cd 100644 (file)
@@ -40,9 +40,10 @@ WI.SpreadsheetTextField = class SpreadsheetTextField
 
         this._element.classList.add("spreadsheet-text-field");
 
-        if (WI.settings.experimentalEnableMultiplePropertiesSelection.value)
-            this._element.addEventListener("mouseup", this._handleMouseUp.bind(this));
-        else
+        if (WI.settings.experimentalEnableMultiplePropertiesSelection.value) {
+            this._element.addEventListener("mousedown", this._handleMouseDown.bind(this), true);
+            this._element.addEventListener("click", this._handleClick.bind(this));
+        } else
             this._element.addEventListener("focus", this._handleFocus.bind(this));
 
         this._element.addEventListener("blur", this._handleBlur.bind(this));
@@ -201,11 +202,17 @@ WI.SpreadsheetTextField = class SpreadsheetTextField
         }
     }
 
-    _handleMouseUp(event)
+    _handleClick(event)
     {
         this.startEditing();
     }
 
+    _handleMouseDown(event)
+    {
+        if (this._editing)
+            event.stopPropagation();
+    }
+
     _handleFocus(event)
     {
         this.startEditing();