Web Inspector: Styles: Control-Space should force completion
authornvasilyev@apple.com <nvasilyev@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Thu, 28 Feb 2019 21:19:25 +0000 (21:19 +0000)
committernvasilyev@apple.com <nvasilyev@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Thu, 28 Feb 2019 21:19:25 +0000 (21:19 +0000)
https://bugs.webkit.org/show_bug.cgi?id=194796
<rdar://problem/48180822>

Reviewed by Matt Baker.

Pressing Control-Space when editing CSS property should show completion popover,
even if the value is empty.

* UserInterface/Models/CSSCompletions.js:
(WI.CSSCompletions.prototype.startsWith):
Performance optimization: exit early when `prefix` is empty.

* UserInterface/Views/SpreadsheetStyleProperty.js:
(WI.SpreadsheetStyleProperty.prototype._nameCompletionDataProvider):
(WI.SpreadsheetStyleProperty.prototype._valueCompletionDataProvider):
* UserInterface/Views/SpreadsheetTextField.js:
(WI.SpreadsheetTextField):
(WI.SpreadsheetTextField.prototype._handleKeyDown):
(WI.SpreadsheetTextField.prototype._updateCompletions):

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

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

index bda987e..a9f2f11 100644 (file)
@@ -1,3 +1,26 @@
+2019-02-28  Nikita Vasilyev  <nvasilyev@apple.com>
+
+        Web Inspector: Styles: Control-Space should force completion
+        https://bugs.webkit.org/show_bug.cgi?id=194796
+        <rdar://problem/48180822>
+
+        Reviewed by Matt Baker.
+
+        Pressing Control-Space when editing CSS property should show completion popover,
+        even if the value is empty.
+
+        * UserInterface/Models/CSSCompletions.js:
+        (WI.CSSCompletions.prototype.startsWith):
+        Performance optimization: exit early when `prefix` is empty.
+
+        * UserInterface/Views/SpreadsheetStyleProperty.js:
+        (WI.SpreadsheetStyleProperty.prototype._nameCompletionDataProvider):
+        (WI.SpreadsheetStyleProperty.prototype._valueCompletionDataProvider):
+        * UserInterface/Views/SpreadsheetTextField.js:
+        (WI.SpreadsheetTextField):
+        (WI.SpreadsheetTextField.prototype._handleKeyDown):
+        (WI.SpreadsheetTextField.prototype._updateCompletions):
+
 2019-02-28  Devin Rousso  <drousso@apple.com>
 
         Web Inspector: Canvas: enabling auto-capture if the frame count is empty triggers an assertion
index bb40d39..dc28122 100644 (file)
@@ -265,11 +265,14 @@ WI.CSSCompletions = class CSSCompletions
 
     startsWith(prefix)
     {
-        var firstIndex = this._firstIndexOfPrefix(prefix);
+        if (!prefix)
+            return this._acceptEmptyPrefix ? this._values.slice() : [];
+
+        let firstIndex = this._firstIndexOfPrefix(prefix);
         if (firstIndex === -1)
             return [];
 
-        var results = [];
+        let results = [];
         while (firstIndex < this._values.length && this._values[firstIndex].startsWith(prefix))
             results.push(this._values[firstIndex++]);
         return results;
index 1d55a76..4d8d254 100644 (file)
@@ -727,12 +727,14 @@ WI.SpreadsheetStyleProperty = class SpreadsheetStyleProperty extends WI.Object
         }
     }
 
-    _nameCompletionDataProvider(prefix)
+    _nameCompletionDataProvider(prefix, options = {})
     {
-        return {
-            prefix,
-            completions: WI.CSSCompletions.cssNameCompletions.startsWith(prefix)
-        };
+        let completions;
+        if (!prefix && options.allowEmptyPrefix)
+            completions = WI.CSSCompletions.cssNameCompletions.values;
+        else
+            completions = WI.CSSCompletions.cssNameCompletions.startsWith(prefix);
+        return {prefix, completions};
     }
 
     _handleValueBeforeInput(event)
@@ -758,10 +760,12 @@ WI.SpreadsheetStyleProperty = class SpreadsheetStyleProperty extends WI.Object
     {
         // For "border: 1px so|", we want to suggest "solid" based on "so" prefix.
         let match = prefix.match(/[a-z0-9()-]+$/i);
-        if (!match)
+
+        // Clicking on the value of `height: 100%` shouldn't show any completions.
+        if (!match && prefix)
             return {completions: [], prefix: ""};
 
-        prefix = match[0];
+        prefix = match ? match[0] : "";
         let propertyName = this._nameElement.textContent.trim();
         return {
             prefix,
index ca5a84a..12474a5 100644 (file)
@@ -49,6 +49,7 @@ WI.SpreadsheetTextField = class SpreadsheetTextField
         this._editing = false;
         this._valueBeforeEditing = "";
         this._completionPrefix = "";
+        this._controlSpaceKeyboardShortcut = new WI.KeyboardShortcut(WI.KeyboardShortcut.Modifier.Control, WI.KeyboardShortcut.Key.Space);
     }
 
     // Public
@@ -278,6 +279,17 @@ WI.SpreadsheetTextField = class SpreadsheetTextField
             }
         }
 
+        if (this._controlSpaceKeyboardShortcut.matchesEvent(event)) {
+            event.stop();
+            if (this._suggestionsView.visible)
+                this._suggestionsView.hide();
+            else {
+                const forceCompletions = true;
+                this._updateCompletions(forceCompletions);
+            }
+            return;
+        }
+
         if (event.key === "Escape") {
             event.stop();
             this._discardChange();
@@ -358,13 +370,13 @@ WI.SpreadsheetTextField = class SpreadsheetTextField
             this._delegate.spreadsheetTextFieldDidChange(this);
     }
 
-    _updateCompletions()
+    _updateCompletions(forceCompletions = false)
     {
         if (!this._completionProvider)
             return;
 
         let valueWithoutSuggestion = this.valueWithoutSuggestion();
-        let {completions, prefix} = this._completionProvider(valueWithoutSuggestion);
+        let {completions, prefix} = this._completionProvider(valueWithoutSuggestion, {allowEmptyPrefix: forceCompletions});
         this._completionPrefix = prefix;
 
         if (!completions.length) {