Title: [274157] trunk/Source/WebInspectorUI
- Revision
- 274157
- Author
- rcali...@apple.com
- Date
- 2021-03-09 10:32:07 -0800 (Tue, 09 Mar 2021)
Log Message
Web Inspector: Jump from Layout panel to grid container element
https://bugs.webkit.org/show_bug.cgi?id=222429
<rdar://problem/74751801>
Reviewed by Devin Rousso.
Add a button to inspect a CSS grid overlay's corresponding element.
Remove the similar functionality from the overloaded label.
* UserInterface/Views/CSSGridSection.css:
(.css-grid-section .node-display-name,):
(.css-grid-section .node-overlay-list-item-container :is(.go-to-arrow, .inline-swatch)):
(.css-grid-section .node-overlay-list-item-container:not(:hover) .go-to-arrow):
* UserInterface/Views/CSSGridSection.js:
(WI.CSSGridSection.prototype.layout):
Modified Paths
Diff
Modified: trunk/Source/WebInspectorUI/ChangeLog (274156 => 274157)
--- trunk/Source/WebInspectorUI/ChangeLog 2021-03-09 18:15:14 UTC (rev 274156)
+++ trunk/Source/WebInspectorUI/ChangeLog 2021-03-09 18:32:07 UTC (rev 274157)
@@ -1,5 +1,23 @@
2021-03-09 Razvan Caliman <rcali...@apple.com>
+ Web Inspector: Jump from Layout panel to grid container element
+ https://bugs.webkit.org/show_bug.cgi?id=222429
+ <rdar://problem/74751801>
+
+ Reviewed by Devin Rousso.
+
+ Add a button to inspect a CSS grid overlay's corresponding element.
+ Remove the similar functionality from the overloaded label.
+
+ * UserInterface/Views/CSSGridSection.css:
+ (.css-grid-section .node-display-name,):
+ (.css-grid-section .node-overlay-list-item-container :is(.go-to-arrow, .inline-swatch)):
+ (.css-grid-section .node-overlay-list-item-container:not(:hover) .go-to-arrow):
+ * UserInterface/Views/CSSGridSection.js:
+ (WI.CSSGridSection.prototype.layout):
+
+2021-03-09 Razvan Caliman <rcali...@apple.com>
+
[Cocoa] Web Inspector: Console search box is broken, advancing to next result instead pastes from system find pasteboard
https://bugs.webkit.org/show_bug.cgi?id=220773
<rdar://problem/73410423>
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/CSSGridSection.css (274156 => 274157)
--- trunk/Source/WebInspectorUI/UserInterface/Views/CSSGridSection.css 2021-03-09 18:15:14 UTC (rev 274156)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/CSSGridSection.css 2021-03-09 18:32:07 UTC (rev 274157)
@@ -23,10 +23,9 @@
* THE POSSIBILITY OF SUCH DAMAGE.
*/
-.css-grid-section .node-link,
+.css-grid-section .node-display-name,
.css-grid-section .editor-group > .editor > label {
margin-inline: 5px;
- text-decoration: none;
}
.css-grid-section .node-overlay-list {
@@ -48,10 +47,14 @@
text-overflow: ellipsis;
}
-.css-grid-section .node-overlay-list-item-container .inline-swatch {
+.css-grid-section .node-overlay-list-item-container :is(.go-to-arrow, .inline-swatch) {
flex-shrink: 0;
}
+.css-grid-section .node-overlay-list-item-container:not(:hover) .go-to-arrow {
+ opacity: 0;
+}
+
.css-grid-section :is(.heading, .title) {
font-size: 11px;
margin-top: 10px;
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/CSSGridSection.js (274156 => 274157)
--- trunk/Source/WebInspectorUI/UserInterface/Views/CSSGridSection.js 2021-03-09 18:15:14 UTC (rev 274156)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/CSSGridSection.js 2021-03-09 18:32:07 UTC (rev 274157)
@@ -101,8 +101,11 @@
let checkboxElement = labelElement.appendChild(document.createElement("input"));
checkboxElement.type = "checkbox";
checkboxElement.checked = nodesWithGridOverlay.includes(domNode);
- labelElement.appendChild(WI.linkifyNodeReference(domNode));
+ const nodeDisplayName = labelElement.appendChild(document.createElement("span"));
+ nodeDisplayName.classList.add("node-display-name");
+ nodeDisplayName.textContent = domNode.displayName;
+
this._checkboxElementByNodeMap.set(domNode, checkboxElement);
checkboxElement.addEventListener("change", (event) => {
@@ -128,6 +131,10 @@
gridColor = event.target.value;
WI.overlayManager.setGridColorForNode(domNode, gridColor);
}, swatch);
+
+ let buttonElement = itemContainerElement.appendChild(WI.createGoToArrowButton());
+ buttonElement.title = WI.repeatedUIString.revealInDOMTree();
+ WI.bindInteractionsForNodeToElement(domNode, buttonElement);
}
}
_______________________________________________
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes
