Attachment 373548 Details for Bug 199341 – Patch

[patch] Patch

patch.txt (text/plain), 8.60 KB, created by Nikita Vasilyev on 2019-07-05 15:51:53 PDT

(hide)

Description:

Filename:

MIME Type:

Creator: Nikita Vasilyev

Created: 2019-07-05 15:51:53 PDT

Size: 8.60 KB

patch

obsolete

>diff --git a/Source/WebInspectorUI/ChangeLog b/Source/WebInspectorUI/ChangeLog
>index 915cc2e7361..9dc642649ef 100644
>--- a/Source/WebInspectorUI/ChangeLog
>+++ b/Source/WebInspectorUI/ChangeLog
>@@ -1,3 +1,30 @@
>+2019-07-05  Nikita Vasilyev  <nvasilyev@apple.com>
>+
>+        Web Inspector: Styles: Command-X should cut selected properties
>+        https://bugs.webkit.org/show_bug.cgi?id=199341
>+
>+        Reviewed by NOBODY (OOPS!).
>+
>+        Implement cutting of selected CSS properties in the style editor.
>+        Unify cutting and copying logic wherever possible.
>+
>+        * UserInterface/Views/SpreadsheetCSSStyleDeclarationEditor.js:
>+        (WI.SpreadsheetCSSStyleDeclarationEditor.prototype.initialLayout):
>+        (WI.SpreadsheetCSSStyleDeclarationEditor.prototype.placeTextCaretInFocusedProperty): Added.
>+        (WI.SpreadsheetCSSStyleDeclarationEditor.prototype.spreadsheetStylePropertyCopy): Deleted.
>+        (WI.SpreadsheetCSSStyleDeclarationEditor.prototype._handleKeyDown):
>+
>+        (WI.SpreadsheetCSSStyleDeclarationEditor.prototype._copySelectedProperties): Added.
>+        Introduce this method to use when copying and cutting CSS properties.
>+
>+        (WI.SpreadsheetCSSStyleDeclarationEditor.prototype._removeSelectedProperties): Added.
>+        Introduce this method to use when cutting and removing CSS properties (by pressing Delete).
>+
>+        * UserInterface/Views/SpreadsheetCSSStyleDeclarationSection.js:
>+        (WI.SpreadsheetCSSStyleDeclarationSection.prototype._stopSelection):
>+        * UserInterface/Views/SpreadsheetStyleProperty.js:
>+        Remove old copying logic.
>+
> 2019-06-27  Beth Dakin  <bdakin@apple.com>
> 
>         Upstream use of MACCATALYST
>diff --git a/Source/WebInspectorUI/UserInterface/Views/SpreadsheetCSSStyleDeclarationEditor.js b/Source/WebInspectorUI/UserInterface/Views/SpreadsheetCSSStyleDeclarationEditor.js
>index cb93cae59f3..cbf515b9b21 100644
>--- a/Source/WebInspectorUI/UserInterface/Views/SpreadsheetCSSStyleDeclarationEditor.js
>+++ b/Source/WebInspectorUI/UserInterface/Views/SpreadsheetCSSStyleDeclarationEditor.js
>@@ -69,6 +69,8 @@ WI.SpreadsheetCSSStyleDeclarationEditor = class SpreadsheetCSSStyleDeclarationEd
>         }, true);
> 
>         this.element.addEventListener("keydown", this._handleKeyDown.bind(this));
>+        this.element.addEventListener("cut", this._handleCut.bind(this));
>+        this.element.addEventListener("copy", this._handleCopy.bind(this));
>     }
> 
>     layout()
>@@ -368,6 +370,17 @@ WI.SpreadsheetCSSStyleDeclarationEditor = class SpreadsheetCSSStyleDeclarationEd
>         this._focusIndex = NaN;
>     }
> 
>+    placeTextCaretInFocusedProperty()
>+    {
>+        if (isNaN(this._focusIndex))
>+            return;
>+
>+        let focusedProperty = this._propertyViews[this._focusIndex];
>+        let selection = window.getSelection();
>+        selection.removeAllRanges();
>+        selection.setBaseAndExtent(focusedProperty.element, 0, focusedProperty.element, 0);
>+    }
>+
>     applyFilter(filterText)
>     {
>         this._filterText = filterText;
>@@ -471,22 +484,6 @@ WI.SpreadsheetCSSStyleDeclarationEditor = class SpreadsheetCSSStyleDeclarationEd
>         this._pendingAddBlankPropertyIndexOffset = this._propertyViews.length - index;
>     }
> 
>-    spreadsheetStylePropertyCopy(event)
>-    {
>-        if (!this.hasSelectedProperties())
>-            return;
>-
>-        let formattedProperties = [];
>-        let [startIndex, endIndex] = this.selectionRange;
>-        for (let i = startIndex; i <= endIndex; ++i) {
>-            let propertyView = this._propertyViews[i];
>-            formattedProperties.push(propertyView.property.formattedText);
>-        }
>-
>-        event.clipboardData.setData("text/plain", formattedProperties.join("\n"));
>-        event.stop();
>-    }
>-
>     spreadsheetStylePropertyWillRemove(propertyView)
>     {
>         this._propertyViews.remove(propertyView);
>@@ -553,23 +550,9 @@ WI.SpreadsheetCSSStyleDeclarationEditor = class SpreadsheetCSSStyleDeclarationEd
>             if (!this.style.editable)
>                 return;
> 
>-            let [startIndex, endIndex] = this.selectionRange;
>-
>-            let propertyIndexToSelect = NaN;
>-            if (endIndex + 1 !== this._propertyViews.length)
>-                propertyIndexToSelect = startIndex;
>-            else if (startIndex > 0)
>-                propertyIndexToSelect = startIndex - 1;
>-
>-            this.deselectProperties();
>-
>-            for (let i = endIndex; i >= startIndex; i--)
>-                this._propertyViews[i].remove();
>-
>-            if (!isNaN(propertyIndexToSelect))
>-                this.selectProperties(propertyIndexToSelect, propertyIndexToSelect);
>-
>-            event.stop();
>+            let removed = this._removeSelectedProperties();
>+            if (removed)
>+                event.stop();
> 
>         } else if ((event.code === "Space" && !event.shiftKey && !event.metaKey && !event.ctrlKey) || (event.key === "/" && event.commandOrControlKey && !event.shiftKey)) {
>             if (!this.style.editable)
>@@ -597,6 +580,58 @@ WI.SpreadsheetCSSStyleDeclarationEditor = class SpreadsheetCSSStyleDeclarationEd
>             this.deselectProperties();
>     }
> 
>+    _handleCopy(event)
>+    {
>+        if (!this.hasSelectedProperties())
>+            return;
>+
>+        this._copySelectedProperties(event);
>+    }
>+
>+    _handleCut(event)
>+    {
>+        if (!this.hasSelectedProperties())
>+            return;
>+
>+        if (!this.style.editable) {
>+            InspectorFrontendHost.beep();
>+            return;
>+        }
>+
>+        this._copySelectedProperties(event);
>+        this._removeSelectedProperties();
>+    }
>+
>+    _copySelectedProperties(event)
>+    {
>+        let [startIndex, endIndex] = this.selectionRange;
>+        let formattedProperties = this._propertyViews.slice(startIndex, endIndex + 1).map((propertyView) => propertyView.property.formattedText);
>+        event.clipboardData.setData("text/plain", formattedProperties.join("\n"));
>+        event.stop();
>+    }
>+
>+    _removeSelectedProperties()
>+    {
>+        console.assert(this.style.editable);
>+        let [startIndex, endIndex] = this.selectionRange;
>+
>+        let propertyIndexToSelect = NaN;
>+        if (endIndex + 1 !== this._propertyViews.length)
>+            propertyIndexToSelect = startIndex;
>+        else if (startIndex > 0)
>+            propertyIndexToSelect = startIndex - 1;
>+
>+        this.deselectProperties();
>+
>+        for (let i = endIndex; i >= startIndex; i--)
>+            this._propertyViews[i].remove();
>+
>+        if (!isNaN(propertyIndexToSelect))
>+            this.selectProperties(propertyIndexToSelect, propertyIndexToSelect);
>+
>+        return true;
>+    }
>+
>     _editablePropertyAfter(propertyIndex)
>     {
>         for (let index = propertyIndex + 1; index < this._propertyViews.length; index++) {
>diff --git a/Source/WebInspectorUI/UserInterface/Views/SpreadsheetCSSStyleDeclarationSection.js b/Source/WebInspectorUI/UserInterface/Views/SpreadsheetCSSStyleDeclarationSection.js
>index 60f3931b5fb..b2eb0bf80e8 100644
>--- a/Source/WebInspectorUI/UserInterface/Views/SpreadsheetCSSStyleDeclarationSection.js
>+++ b/Source/WebInspectorUI/UserInterface/Views/SpreadsheetCSSStyleDeclarationSection.js
>@@ -490,6 +490,10 @@ WI.SpreadsheetCSSStyleDeclarationSection = class SpreadsheetCSSStyleDeclarationS
>         this._mouseDownIndex = NaN;
>         this._element.classList.remove("selecting");
> 
>+        // "copy" and "cut" events won't fire on SpreadsheetCSSStyleDeclarationEditor unless it has text selected.
>+        // Placing a text caret inside of a property has no visible effects but it allows the events to fire.
>+        this._propertiesEditor.placeTextCaretInFocusedProperty();
>+
>         window.removeEventListener("mousemove", this._boundHandleWindowMouseMove);
>         this._mouseDownPoint = null;
>     }
>diff --git a/Source/WebInspectorUI/UserInterface/Views/SpreadsheetStyleProperty.js b/Source/WebInspectorUI/UserInterface/Views/SpreadsheetStyleProperty.js
>index dd7a0c5f4e2..1806023583f 100644
>--- a/Source/WebInspectorUI/UserInterface/Views/SpreadsheetStyleProperty.js
>+++ b/Source/WebInspectorUI/UserInterface/Views/SpreadsheetStyleProperty.js
>@@ -73,8 +73,6 @@ WI.SpreadsheetStyleProperty = class SpreadsheetStyleProperty extends WI.Object
>                 this._toggle();
>                 this._select();
>             }, this._element);
>-
>-            this._element.copyHandler = this;
>         }
>     }
> 
>@@ -336,11 +334,6 @@ WI.SpreadsheetStyleProperty = class SpreadsheetStyleProperty extends WI.Object
>         return matches;
>     }
> 
>-    handleCopyEvent(event)
>-    {
>-        this._delegate.spreadsheetStylePropertyCopy(event, this);
>-    }
>-
>     // SpreadsheetTextField delegate
> 
>     spreadsheetTextFieldWillStartEditing(textField)

Actions: View | Formatted Diff | Diff

Attachments on bug 199341: 373170 | 373172 | 373548 | 373555 | 374532 | 374710 | 374732