Title: [228487] trunk/Source/WebInspectorUI
- Revision
- 228487
- Author
- nvasil...@apple.com
- Date
- 2018-02-14 14:45:50 -0800 (Wed, 14 Feb 2018)
Log Message
Web Inspector: Styles: completion popover doesn't hide when switching panels
https://bugs.webkit.org/show_bug.cgi?id=182464
<rdar://problem/37202763>
Reviewed by Timothy Hatcher.
Save the position of the anchor, an element the popover is shown for, and hide the completion popover
when the position changes.
* UserInterface/Views/CompletionSuggestionsView.js:
(WI.CompletionSuggestionsView.prototype.showUntilAnchorMoves):
When the popover is visible, check every 200ms if the anchor moved.
(WI.CompletionSuggestionsView.prototype.hide):
* UserInterface/Views/SpreadsheetTextField.js:
(WI.SpreadsheetTextField.prototype._updateCompletions):
(WI.SpreadsheetTextField.prototype._getCaretRect):
getBoundingClientRect returns {x: 0, y: 0} when it can't determine node's position.
This happens when a node isn't attached to DOM, attached to DOM but not visible, and
a number of odd cases.
Modified Paths
Diff
Modified: trunk/Source/WebInspectorUI/ChangeLog (228486 => 228487)
--- trunk/Source/WebInspectorUI/ChangeLog 2018-02-14 22:27:52 UTC (rev 228486)
+++ trunk/Source/WebInspectorUI/ChangeLog 2018-02-14 22:45:50 UTC (rev 228487)
@@ -1,3 +1,26 @@
+2018-02-14 Nikita Vasilyev <nvasil...@apple.com>
+
+ Web Inspector: Styles: completion popover doesn't hide when switching panels
+ https://bugs.webkit.org/show_bug.cgi?id=182464
+ <rdar://problem/37202763>
+
+ Reviewed by Timothy Hatcher.
+
+ Save the position of the anchor, an element the popover is shown for, and hide the completion popover
+ when the position changes.
+
+ * UserInterface/Views/CompletionSuggestionsView.js:
+ (WI.CompletionSuggestionsView.prototype.showUntilAnchorMoves):
+ When the popover is visible, check every 200ms if the anchor moved.
+
+ (WI.CompletionSuggestionsView.prototype.hide):
+ * UserInterface/Views/SpreadsheetTextField.js:
+ (WI.SpreadsheetTextField.prototype._updateCompletions):
+ (WI.SpreadsheetTextField.prototype._getCaretRect):
+ getBoundingClientRect returns {x: 0, y: 0} when it can't determine node's position.
+ This happens when a node isn't attached to DOM, attached to DOM but not visible, and
+ a number of odd cases.
+
2018-02-14 Matt Baker <mattba...@apple.com>
Web Inspector: TabBar redesign: only show allowed tabs in the available tabs context menu
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/CompletionSuggestionsView.js (228486 => 228487)
--- trunk/Source/WebInspectorUI/UserInterface/Views/CompletionSuggestionsView.js 2018-02-14 22:27:52 UTC (rev 228486)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/CompletionSuggestionsView.js 2018-02-14 22:45:50 UTC (rev 228487)
@@ -33,6 +33,7 @@
this._preventBlur = preventBlur || false;
this._selectedIndex = NaN;
+ this._anchorBounds = null;
this._element = document.createElement("div");
this._element.classList.add("completion-suggestions", WI.Popover.IgnoreAutoDismissClassName);
@@ -157,9 +158,36 @@
document.body.appendChild(this._element);
}
+ showUntilAnchorMoves(getAnchorBounds)
+ {
+ this._anchorBounds = getAnchorBounds();
+ if (!this._anchorBounds) {
+ this.hide();
+ return;
+ }
+
+ this.show(this._anchorBounds);
+
+ let hideWhenMoved = () => {
+ let anchorBounds = getAnchorBounds();
+ if (!anchorBounds || !anchorBounds.equals(this._anchorBounds))
+ this.hide();
+ };
+
+ if (this._hideWhenMovedIdentifier)
+ clearInterval(this._hideWhenMovedIdentifier);
+
+ this._hideWhenMovedIdentifier = setInterval(hideWhenMoved, 200);
+ }
+
hide()
{
this._element.remove();
+ this._anchorBounds = null;
+ if (this._hideWhenMovedIdentifier) {
+ clearInterval(this._hideWhenMovedIdentifier);
+ this._hideWhenMovedIdentifier = 0;
+ }
}
update(completions, selectedIndex)
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/SpreadsheetTextField.js (228486 => 228487)
--- trunk/Source/WebInspectorUI/UserInterface/Views/SpreadsheetTextField.js 2018-02-14 22:27:52 UTC (rev 228486)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/SpreadsheetTextField.js 2018-02-14 22:45:50 UTC (rev 228487)
@@ -377,8 +377,10 @@
// No need to show the completion popover that matches the suggestion hint.
this._suggestionsView.hide();
} else {
- let caretRect = this._getCaretRect(prefix, completionPrefix);
- this._suggestionsView.show(caretRect);
+ let startOffset = prefix.length - completionPrefix.length;
+ this._suggestionsView.showUntilAnchorMoves(() => {
+ return this._getCaretRect(startOffset);
+ });
}
this._suggestionsView.selectedIndex = NaN;
@@ -389,19 +391,30 @@
this.suggestionHint = "";
}
- _getCaretRect(prefix, completionPrefix)
+ _getCaretRect(startOffset)
{
- let startOffset = prefix.length - completionPrefix.length;
let selection = window.getSelection();
- if (startOffset > 0 && selection.rangeCount) {
+ let isHidden = (clientRect) => {
+ return clientRect.x === 0 && clientRect.y === 0
+ };
+
+ if (selection.rangeCount) {
let range = selection.getRangeAt(0).cloneRange();
range.setStart(range.startContainer, startOffset);
let clientRect = range.getBoundingClientRect();
- return WI.Rect.rectFromClientRect(clientRect);
+
+ if (!isHidden(clientRect)) {
+ // This happens after deleting value. However, when focusing
+ // on an empty value clientRect is visible.
+ return WI.Rect.rectFromClientRect(clientRect);
+ }
}
let clientRect = this._element.getBoundingClientRect();
+ if (isHidden(clientRect))
+ return null;
+
const leftPadding = parseInt(getComputedStyle(this._element).paddingLeft) || 0;
return new WI.Rect(clientRect.left + leftPadding, clientRect.top, clientRect.width, clientRect.height);
}
_______________________________________________
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes
