Title: [224286] trunk/Source/WebInspectorUI
- Revision
- 224286
- Author
- nvasil...@apple.com
- Date
- 2017-11-01 12:10:20 -0700 (Wed, 01 Nov 2017)
Log Message
Web Inspector: Styles Redesign: Hovering over a selector should highlight matching elements on the page
https://bugs.webkit.org/show_bug.cgi?id=179040
Reviewed by Devin Rousso.
* UserInterface/Views/SpreadsheetCSSStyleDeclarationSection.js:
(WI.SpreadsheetCSSStyleDeclarationSection.prototype.initialLayout):
Use mouseenter/mouseleave events instead of mousein/mouseout (as in the old styles sidebar)
to avoid unnecessary events being fired.
(WI.SpreadsheetCSSStyleDeclarationSection.prototype._highlightNodesWithSelector):
(WI.SpreadsheetCSSStyleDeclarationSection.prototype._hideDOMNodeHighlight):
Modified Paths
Diff
Modified: trunk/Source/WebInspectorUI/ChangeLog (224285 => 224286)
--- trunk/Source/WebInspectorUI/ChangeLog 2017-11-01 18:54:54 UTC (rev 224285)
+++ trunk/Source/WebInspectorUI/ChangeLog 2017-11-01 19:10:20 UTC (rev 224286)
@@ -1,3 +1,18 @@
+2017-11-01 Nikita Vasilyev <nvasil...@apple.com>
+
+ Web Inspector: Styles Redesign: Hovering over a selector should highlight matching elements on the page
+ https://bugs.webkit.org/show_bug.cgi?id=179040
+
+ Reviewed by Devin Rousso.
+
+ * UserInterface/Views/SpreadsheetCSSStyleDeclarationSection.js:
+ (WI.SpreadsheetCSSStyleDeclarationSection.prototype.initialLayout):
+ Use mouseenter/mouseleave events instead of mousein/mouseout (as in the old styles sidebar)
+ to avoid unnecessary events being fired.
+
+ (WI.SpreadsheetCSSStyleDeclarationSection.prototype._highlightNodesWithSelector):
+ (WI.SpreadsheetCSSStyleDeclarationSection.prototype._hideDOMNodeHighlight):
+
2017-10-30 Nikita Vasilyev <nvasil...@apple.com>
Web Inspector: [PARITY] Styles Redesign: Ability to modify style attributes
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/SpreadsheetCSSStyleDeclarationSection.js (224285 => 224286)
--- trunk/Source/WebInspectorUI/UserInterface/Views/SpreadsheetCSSStyleDeclarationSection.js 2017-11-01 18:54:54 UTC (rev 224285)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/SpreadsheetCSSStyleDeclarationSection.js 2017-11-01 19:10:20 UTC (rev 224286)
@@ -64,6 +64,8 @@
this._selectorElement = document.createElement("span");
this._selectorElement.classList.add("selector");
+ this._selectorElement.addEventListener("mouseenter", this._highlightNodesWithSelector.bind(this));
+ this._selectorElement.addEventListener("mouseleave", this._hideDOMNodeHighlight.bind(this));
this._headerElement.append(this._selectorElement);
let openBrace = document.createElement("span");
@@ -369,6 +371,22 @@
const appendAfterLast = -1;
this._propertiesEditor.addBlankProperty(appendAfterLast);
}
+
+ _highlightNodesWithSelector()
+ {
+ if (!this._style.ownerRule) {
+ WI.domTreeManager.highlightDOMNode(this._style.node.id);
+ return;
+ }
+
+ let selectorText = this._selectorElement.textContent.trim();
+ WI.domTreeManager.highlightSelector(selectorText, this._style.node.ownerDocument.frameIdentifier);
+ }
+
+ _hideDOMNodeHighlight()
+ {
+ WI.domTreeManager.hideDOMNodeHighlight();
+ }
};
WI.SpreadsheetCSSStyleDeclarationSection.MatchedSelectorElementStyleClassName = "matched";
_______________________________________________
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes
