Title: [185571] trunk/Source/WebInspectorUI
- Revision
- 185571
- Author
- [email protected]
- Date
- 2015-06-15 16:32:45 -0700 (Mon, 15 Jun 2015)
Log Message
Web Inspector: Stylize Node Previews
https://bugs.webkit.org/show_bug.cgi?id=145990
Patch by Joseph Pecoraro <[email protected]> on 2015-06-15
Reviewed by Timothy Hatcher.
* UserInterface/Views/FormattedValue.js:
(WebInspector.FormattedValue.createElementForNodePreview):
Style a node preview like a DOMNode. It is a simple small snippet.
* UserInterface/Views/ObjectPreviewView.js:
(WebInspector.ObjectPreviewView.prototype._appendPropertyPreviews):
Use node previews in ObjectPreviewViews.
Modified Paths
Diff
Modified: trunk/Source/WebInspectorUI/ChangeLog (185570 => 185571)
--- trunk/Source/WebInspectorUI/ChangeLog 2015-06-15 23:06:01 UTC (rev 185570)
+++ trunk/Source/WebInspectorUI/ChangeLog 2015-06-15 23:32:45 UTC (rev 185571)
@@ -1,5 +1,20 @@
2015-06-15 Joseph Pecoraro <[email protected]>
+ Web Inspector: Stylize Node Previews
+ https://bugs.webkit.org/show_bug.cgi?id=145990
+
+ Reviewed by Timothy Hatcher.
+
+ * UserInterface/Views/FormattedValue.js:
+ (WebInspector.FormattedValue.createElementForNodePreview):
+ Style a node preview like a DOMNode. It is a simple small snippet.
+
+ * UserInterface/Views/ObjectPreviewView.js:
+ (WebInspector.ObjectPreviewView.prototype._appendPropertyPreviews):
+ Use node previews in ObjectPreviewViews.
+
+2015-06-15 Joseph Pecoraro <[email protected]>
+
Web Inspector: Improve some cases of "Object?" Type Annotations
https://bugs.webkit.org/show_bug.cgi?id=145954
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/FormattedValue.js (185570 => 185571)
--- trunk/Source/WebInspectorUI/UserInterface/Views/FormattedValue.js 2015-06-15 23:06:01 UTC (rev 185570)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/FormattedValue.js 2015-06-15 23:32:45 UTC (rev 185571)
@@ -67,6 +67,48 @@
return span;
};
+WebInspector.FormattedValue.createElementForNodePreview = function(preview)
+{
+ var span = document.createElement("span");
+ span.className = "formatted-node-preview syntax-highlighted";
+
+ // A node preview has a very strict format, with at most a single attribute.
+ // We can style it up like a DOMNode without interactivity.
+ var matches = preview.value.match(/^<(\S+?)(?: (\S+?)="(.*?)")?>$/);
+ if (!matches) {
+ console.error("Node preview did not match format.", preview.value)
+ span.textContent = preview.value;
+ return span;
+ }
+
+ var tag = document.createElement("span");
+ tag.className = "html-tag";
+ tag.appendChild(document.createTextNode("<"));
+
+ var tagName = tag.appendChild(document.createElement("span"));
+ tagName.className = "html-tag-name";
+ tagName.textContent = matches[1];
+
+ if (matches[2]) {
+ tag.appendChild(document.createTextNode(" "));
+ var attribute = tag.appendChild(document.createElement("span"));
+ attribute.className = "html-attribute";
+ var attributeName = attribute.appendChild(document.createElement("span"));
+ attributeName.className = "html-attribute-name";
+ attributeName.textContent = matches[2];
+ attribute.appendChild(document.createTextNode("=\""));
+ var attributeValue = attribute.appendChild(document.createElement("span"));
+ attributeValue.className = "html-attribute-value";
+ attributeValue.textContent = matches[3];
+ attribute.appendChild(document.createTextNode("\""));
+ }
+
+ tag.appendChild(document.createTextNode(">"));
+ span.appendChild(tag);
+
+ return span;
+};
+
WebInspector.FormattedValue.createElementForTypesAndValue = function(type, subtype, displayString, size, isPreview, hadException)
{
var span = document.createElement("span");
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ObjectPreviewView.js (185570 => 185571)
--- trunk/Source/WebInspectorUI/UserInterface/Views/ObjectPreviewView.js 2015-06-15 23:06:01 UTC (rev 185570)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ObjectPreviewView.js 2015-06-15 23:32:45 UTC (rev 185571)
@@ -218,6 +218,8 @@
if (property.valuePreview)
this._appendPreview(element, property.valuePreview);
+ else if (property.subtype === "node")
+ element.appendChild(WebInspector.FormattedValue.createElementForNodePreview(property));
else
element.appendChild(WebInspector.FormattedValue.createElementForPropertyPreview(property));
}
_______________________________________________
webkit-changes mailing list
[email protected]
https://lists.webkit.org/mailman/listinfo/webkit-changes
