Merge 135720 - Web Inspector: object preview does not render node id, className; logs too many func…

Source/WebCore/inspector/front-end/ConsoleMessage.js

Index: Source/WebCore/inspector/front-end/ConsoleMessage.js
===================================================================
--- Source/WebCore/inspector/front-end/ConsoleMessage.js	(revision 136041)
+++ Source/WebCore/inspector/front-end/ConsoleMessage.js	(working copy)
@@ -318,17 +318,7 @@
                 titleElement.createTextChild(": ");
             }
 
-            var span = titleElement.createChild("span", "console-formatted-" + property.type);
-            if (property.type === "object") {
-                if (property.subtype === "node")
-                    span.addStyleClass("console-formatted-preview-node");
-                else if (property.subtype === "regexp")
-                    span.addStyleClass("console-formatted-string");
-                span.textContent = property.value;
-            } else if (property.type === "function")
-                span.textContent = "function";
-            else
-                span.textContent = property.value;
+            this._appendPropertyPreview(titleElement, property);
         }
         if (preview.overflow)
             titleElement.createChild("span").textContent = "\u2026";
@@ -336,6 +326,39 @@
         return preview.lossless;
     },
 
+    /**
+     * @param {Element} titleElement
+     * @param {RuntimeAgent.PropertyPreview} property
+     */
+    _appendPropertyPreview: function(titleElement, property)
+    {
+        var span = titleElement.createChild("span", "console-formatted-" + property.type);
+
+        if (property.type === "function") {
+            span.textContent = "function";
+            return;
+        }
+
+        if (property.type === "object" && property.subtype === "regexp") {
+            span.addStyleClass("console-formatted-string");
+            span.textContent = property.value;
+            return;
+        }
+
+        if (property.type === "object" && property.subtype === "node") {
+            span.addStyleClass("console-formatted-preview-node");
+            var match = property.value.match(/([^#.]+)(#[^.]+)?(\..*)?/);
+            span.createChild("span", "webkit-html-tag-name").textContent = match[1];
+            if (match[2])
+                span.createChild("span", "webkit-html-attribute-value").textContent = match[2];
+            if (match[3])
+                span.createChild("span", "webkit-html-attribute-name").textContent = match[3];
+            return;
+        }
+
+        span.textContent = property.value;
+    },
+
     _formatParameterAsNode: function(object, elem)
     {
         function printNode(nodeId)