Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(906)

Unified Diff: third_party/WebKit/Source/devtools/front_end/ui/TextPrompt.js

Issue 2439223002: DevTools: Use grey hint text for applied suggestion in TextPrompt (Closed)
Patch Set: newline for test Created 4 years, 2 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View side-by-side diff with in-line comments
Download patch
« no previous file with comments | « third_party/WebKit/LayoutTests/http/tests/inspector-unit/text-prompt-hint-expected.txt ('k') | no next file » | no next file with comments »
Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
Index: third_party/WebKit/Source/devtools/front_end/ui/TextPrompt.js
diff --git a/third_party/WebKit/Source/devtools/front_end/ui/TextPrompt.js b/third_party/WebKit/Source/devtools/front_end/ui/TextPrompt.js
index 3b03a39af3a76e3b360f30c544051d29c4086e81..86d3ddad6be6c4b10e6feca733eae6009cd62df2 100644
--- a/third_party/WebKit/Source/devtools/front_end/ui/TextPrompt.js
+++ b/third_party/WebKit/Source/devtools/front_end/ui/TextPrompt.js
@@ -45,9 +45,11 @@ WebInspector.TextPrompt = function(completions, stopCharacters)
this._completionStopCharacters = stopCharacters || " =:[({;,!+-*/&|^<>.";
this._autocompletionTimeout = WebInspector.TextPrompt.DefaultAutocompletionTimeout;
this._title = "";
+ this._prefixRange = null;
this._previousText = "";
this._currentHintText = "";
this._completionRequestId = 0;
+ this._autocompleteElement = createElementWithClass("span", "auto-complete-text");
}
WebInspector.TextPrompt.DefaultAutocompletionTimeout = 250;
@@ -140,7 +142,7 @@ WebInspector.TextPrompt.prototype = {
this._element.ownerDocument.defaultView.addEventListener("resize", this._boundClearAutocomplete, false);
if (this._suggestBoxEnabled)
- this._suggestBox = new WebInspector.SuggestBox(this);
+ this._suggestBox = new WebInspector.SuggestBox(this, 20, true);
if (this._title)
this._proxyElement.title = this._title;
@@ -172,7 +174,7 @@ WebInspector.TextPrompt.prototype = {
userEnteredText: function()
{
var text = this.text();
- if (this._autocompleteElement) {
+ if (this._autocompleteElement.parentNode) {
var addition = this._autocompleteElement.textContent;
text = text.substring(0, text.length - addition.length);
}
@@ -280,7 +282,6 @@ WebInspector.TextPrompt.prototype = {
this._selectionTimeout = setTimeout(moveBackIfOutside.bind(this), 100);
},
-
/**
* @param {!Event} event
*/
@@ -294,9 +295,6 @@ WebInspector.TextPrompt.prototype = {
*/
onKeyDown: function(event)
{
- if (isEnterKey(event))
- return;
-
var handled = false;
switch (event.key) {
@@ -347,10 +345,12 @@ WebInspector.TextPrompt.prototype = {
{
var text = this.userEnteredText();
var hasCommonPrefix = text.startsWith(this._previousText) || this._previousText.startsWith(text);
- if (this._autocompleteElement && hasCommonPrefix)
- this._autocompleteElement.textContent = this._currentHintText.substring(text.length);
- else
+ if (this._prefixRange && hasCommonPrefix) {
lushnikov 2016/10/24 21:27:20 let's check that cursor is in the end of the promp
+ this._prefixRange.endColumn += text.length - this._previousText.length;
lushnikov 2016/10/24 21:27:20 this._prefixRange.endColumn = text.length;
+ this._setAutocompleteText(this._currentHintText);
+ } else {
this._clearAutocompleteElement();
+ }
this._previousText = text;
this.autoCompleteSoon();
@@ -381,13 +381,20 @@ WebInspector.TextPrompt.prototype = {
{
this._clearAutocompleteTimeout();
- if (!this._autocompleteElement)
- return;
-
this._autocompleteElement.remove();
- delete this._autocompleteElement;
- delete this._userEnteredRange;
- delete this._userEnteredText;
+ this._prefixRange = null;
lushnikov 2016/10/24 21:27:20 this should probably go inside clearAutocomplete -
+ },
+
+ /**
+ * @param {string} text
+ */
+ _setAutocompleteText: function(text)
lushnikov 2016/10/24 21:27:20 text -> suggestion
+ {
+ if (this.isCaretAtEndOfPrompt() && this._prefixRange) {
+ this._autocompleteElement.textContent = text.substring(this._prefixRange.endColumn - this._prefixRange.startColumn);
+ this._element.appendChild(this._autocompleteElement);
+ }
+ this._currentHintText = text;
},
_clearAutocompleteTimeout: function()
@@ -430,7 +437,7 @@ WebInspector.TextPrompt.prototype = {
else if (!force) {
// BUG72018: Do not show suggest box if caret is followed by a non-stop character.
var wordSuffixRange = selectionRange.startContainer.rangeOfWord(selectionRange.endOffset, this._completionStopCharacters, this._element, "forward");
- var autocompleteTextLength = (this._autocompleteElement && this._autocompleteElement.parentNode) ? this._autocompleteElement.textContent.length : 0;
+ var autocompleteTextLength = this._autocompleteElement.parentNode ? this._autocompleteElement.textContent.length : 0;
if (wordSuffixRange.toString().length !== autocompleteTextLength)
shouldExit = true;
}
@@ -527,41 +534,17 @@ WebInspector.TextPrompt.prototype = {
selectedIndex = (this._disableDefaultSuggestionForEmptyInput && !this.text()) ? -1 : (selectedIndex || 0);
- this._userEnteredRange = fullWordRange;
- this._userEnteredText = fullWordRange.toString();
-
if (this._suggestBox)
- this._suggestBox.updateSuggestions(this._boxForAnchorAtStart(selection, fullWordRange), annotatedCompletions, selectedIndex, !this.isCaretAtEndOfPrompt(), this._userEnteredText);
+ this._suggestBox.updateSuggestions(this._boxForAnchorAtStart(selection, fullWordRange), annotatedCompletions, selectedIndex, !this.isCaretAtEndOfPrompt(), this.userEnteredText());
+
+ var beforeRange = this._createRange();
+ beforeRange.setStart(this._element, 0);
+ beforeRange.setEnd(fullWordRange.startContainer, fullWordRange.startOffset);
+ this._prefixRange = new WebInspector.TextRange(0, beforeRange.toString().length, 0, beforeRange.toString().length + fullWordRange.toString().length);
lushnikov 2016/10/24 21:27:20 let's convert range to string only once - i rememb
if (selectedIndex === -1)
return;
-
- var wordPrefixLength = originalWordPrefixRange.toString().length;
-
- if (this.isCaretAtEndOfPrompt()) {
- var completionText = annotatedCompletions[selectedIndex].title;
- var prefixText = this._userEnteredRange.toString();
- var suffixText = completionText.substring(wordPrefixLength);
- this._userEnteredRange.deleteContents();
- this._element.normalize();
- var finalSelectionRange = this._createRange();
-
- var prefixTextNode = createTextNode(prefixText);
- fullWordRange.insertNode(prefixTextNode);
-
- if (!this._autocompleteElement)
- this._autocompleteElement = createElementWithClass("span", "auto-complete-text");
- this._autocompleteElement.textContent = suffixText;
- this._currentHintText = completionText;
-
- prefixTextNode.parentNode.insertBefore(this._autocompleteElement, prefixTextNode.nextSibling);
-
- finalSelectionRange.setStart(prefixTextNode, wordPrefixLength);
- finalSelectionRange.setEnd(prefixTextNode, wordPrefixLength);
- selection.removeAllRanges();
- selection.addRange(finalSelectionRange);
- this.dispatchEventToListeners(WebInspector.TextPrompt.Events.ItemApplied);
- }
+ this.applySuggestion(annotatedCompletions[selectedIndex].title, true);
},
/**
@@ -571,44 +554,11 @@ WebInspector.TextPrompt.prototype = {
*/
applySuggestion: function(completionText, isIntermediateSuggestion)
{
- this._applySuggestion(completionText, isIntermediateSuggestion);
- },
-
- /**
- * @param {string} completionText
- * @param {boolean=} isIntermediateSuggestion
- */
- _applySuggestion: function(completionText, isIntermediateSuggestion)
- {
- if (!this._userEnteredRange) {
- // We could have already cleared autocompletion range by the time this is called. (crbug.com/587683)
+ if (!this._prefixRange)
return;
- }
-
- var wordPrefixLength = this._userEnteredText ? this._userEnteredText.length : 0;
-
- this._userEnteredRange.deleteContents();
- this._element.normalize();
- var finalSelectionRange = this._createRange();
- var completionTextNode = createTextNode(completionText);
- this._userEnteredRange.insertNode(completionTextNode);
- if (this._autocompleteElement) {
- this._autocompleteElement.remove();
- delete this._autocompleteElement;
- }
-
+ this._setAutocompleteText(completionText);
if (isIntermediateSuggestion)
- finalSelectionRange.setStart(completionTextNode, wordPrefixLength);
- else
- finalSelectionRange.setStart(completionTextNode, completionText.length);
-
- finalSelectionRange.setEnd(completionTextNode, completionText.length);
-
- var selection = this._element.getComponentSelection();
- selection.removeAllRanges();
- selection.addRange(finalSelectionRange);
- if (isIntermediateSuggestion)
- this.dispatchEventToListeners(WebInspector.TextPrompt.Events.ItemApplied, { itemText: completionText });
+ this.dispatchEventToListeners(WebInspector.TextPrompt.Events.ItemApplied);
},
/**
@@ -624,21 +574,13 @@ WebInspector.TextPrompt.prototype = {
*/
_acceptSuggestionInternal: function()
{
- if (!this._autocompleteElement || !this._autocompleteElement.parentNode)
+ if (!this._prefixRange)
return false;
- var text = this._autocompleteElement.textContent;
- var textNode = createTextNode(text);
- this._autocompleteElement.parentNode.replaceChild(textNode, this._autocompleteElement);
- delete this._autocompleteElement;
-
- var finalSelectionRange = this._createRange();
- finalSelectionRange.setStart(textNode, text.length);
- finalSelectionRange.setEnd(textNode, text.length);
-
- var selection = this._element.getComponentSelection();
- selection.removeAllRanges();
- selection.addRange(finalSelectionRange);
+ this._autocompleteElement.remove();
+ var text = this.userEnteredText();
+ this._element.textContent = text.substring(0, this._prefixRange.startColumn) + this._currentHintText + text.substring(this._prefixRange.endColumn);
+ this._setDOMSelection(this._prefixRange.startColumn + this._currentHintText.length, this._prefixRange.startColumn + this._currentHintText.length);
this.clearAutocomplete();
this.dispatchEventToListeners(WebInspector.TextPrompt.Events.ItemAccepted);
@@ -647,6 +589,24 @@ WebInspector.TextPrompt.prototype = {
},
/**
+ * @param {number} startColumn
+ * @param {number} endColumn
+ */
+ _setDOMSelection: function(startColumn, endColumn)
+ {
+ this._element.normalize();
+ var node = this._element.childNodes[0];
+ if (!node || node === this._autocompleteElement)
+ return;
+ var range = this._createRange();
+ range.setStart(node, startColumn);
+ range.setEnd(node, endColumn);
+ var selection = this._element.getComponentSelection();
+ selection.removeAllRanges();
+ selection.addRange(range);
+ },
+
+ /**
* @return {boolean}
*/
isSuggestBoxVisible: function()
@@ -687,7 +647,7 @@ WebInspector.TextPrompt.prototype = {
var foundNextText = false;
while (node) {
if (node.nodeType === Node.TEXT_NODE && node.nodeValue.length) {
- if (foundNextText && (!this._autocompleteElement || !this._autocompleteElement.isAncestor(node)))
+ if (foundNextText && !this._autocompleteElement.isAncestor(node))
return false;
foundNextText = true;
}
« no previous file with comments | « third_party/WebKit/LayoutTests/http/tests/inspector-unit/text-prompt-hint-expected.txt ('k') | no next file » | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698