Web Inspector: Debugger Popovers and Probes should use FormattedValue/ObjectTreeView...
authorjoepeck@webkit.org <joepeck@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Thu, 19 Mar 2015 03:26:55 +0000 (03:26 +0000)
committerjoepeck@webkit.org <joepeck@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Thu, 19 Mar 2015 03:26:55 +0000 (03:26 +0000)
https://bugs.webkit.org/show_bug.cgi?id=142830

Reviewed by Timothy Hatcher.

Source/JavaScriptCore:

* inspector/agents/InspectorDebuggerAgent.cpp:
(Inspector::InspectorDebuggerAgent::breakpointActionProbe):
Give Probe Samples object previews.

Source/WebInspectorUI:

* UserInterface/Views/ProbeSetDataGrid.css:
(.details-section.probe-set .data-grid .object-tree > :matches(.title, .object-preview)::before):
Another line-height fix for object tree disclosure triangles.

* UserInterface/Views/ProbeSetDataGridNode.js:
(WebInspector.ProbeSetDataGridNode.prototype.createCellContent):
Create an ObjectTree / FormattedValue for the RemoteObject.

* UserInterface/Views/SourceCodeTextEditor.css:
(.popover .debugger-popover-content > .title):
(.popover .debugger-popover-content > .body):
(.popover .debugger-popover-content.function > .body):
Be more specific and don't accidentally style ".title" within the body.

* UserInterface/Views/SourceCodeTextEditor.js:
(WebInspector.SourceCodeTextEditor.prototype._showPopoverForObject):
Show a properties only ObjectTree instead of an ObjectPropertiesSection.

(WebInspector.SourceCodeTextEditor.prototype._showPopoverForString): Deleted.
(WebInspector.SourceCodeTextEditor.prototype._showPopoverForRegExp): Deleted.
(WebInspector.SourceCodeTextEditor.prototype._showPopoverForNumber): Deleted.
(WebInspector.SourceCodeTextEditor.prototype._showPopoverForBoolean): Deleted.
(WebInspector.SourceCodeTextEditor.prototype._showPopoverForNull): Deleted.
(WebInspector.SourceCodeTextEditor.prototype._showPopoverForUndefined): Deleted.
(WebInspector.SourceCodeTextEditor.prototype._showPopoverWithFormattedValue):
Reduce most of these to a single popover for formatted values.

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@181722 268f45cc-cd09-0410-ab3c-d52691b4dbfc

Source/JavaScriptCore/ChangeLog
Source/JavaScriptCore/inspector/agents/InspectorDebuggerAgent.cpp
Source/WebInspectorUI/ChangeLog
Source/WebInspectorUI/UserInterface/Views/ProbeSetDataGrid.css
Source/WebInspectorUI/UserInterface/Views/ProbeSetDataGridNode.js
Source/WebInspectorUI/UserInterface/Views/SourceCodeTextEditor.css
Source/WebInspectorUI/UserInterface/Views/SourceCodeTextEditor.js

index 5652016..4976e4d 100644 (file)
@@ -1,3 +1,14 @@
+2015-03-18  Joseph Pecoraro  <pecoraro@apple.com>
+
+        Web Inspector: Debugger Popovers and Probes should use FormattedValue/ObjectTreeView instead of Custom/ObjectPropertiesSection
+        https://bugs.webkit.org/show_bug.cgi?id=142830
+
+        Reviewed by Timothy Hatcher.
+
+        * inspector/agents/InspectorDebuggerAgent.cpp:
+        (Inspector::InspectorDebuggerAgent::breakpointActionProbe):
+        Give Probe Samples object previews.
+
 2015-03-17  Ryuan Choi  <ryuan.choi@navercorp.com>
 
         [EFL] Expose JavaScript binding interface through ewk_extension
index 65889ae..52ad21f 100644 (file)
@@ -727,7 +727,7 @@ void InspectorDebuggerAgent::breakpointActionSound(int breakpointActionIdentifie
 void InspectorDebuggerAgent::breakpointActionProbe(JSC::ExecState* scriptState, const ScriptBreakpointAction& action, unsigned batchId, unsigned sampleId, const Deprecated::ScriptValue& sample)
 {
     InjectedScript injectedScript = m_injectedScriptManager->injectedScriptFor(scriptState);
-    RefPtr<Protocol::Runtime::RemoteObject> payload = injectedScript.wrapObject(sample, objectGroupForBreakpointAction(action));
+    RefPtr<Protocol::Runtime::RemoteObject> payload = injectedScript.wrapObject(sample, objectGroupForBreakpointAction(action), true);
     auto result = Protocol::Debugger::ProbeSample::create()
         .setProbeId(action.identifier)
         .setBatchId(batchId)
index 98f6242..b44bb47 100644 (file)
@@ -1,5 +1,39 @@
 2015-03-18  Joseph Pecoraro  <pecoraro@apple.com>
 
+        Web Inspector: Debugger Popovers and Probes should use FormattedValue/ObjectTreeView instead of Custom/ObjectPropertiesSection
+        https://bugs.webkit.org/show_bug.cgi?id=142830
+
+        Reviewed by Timothy Hatcher.
+
+        * UserInterface/Views/ProbeSetDataGrid.css:
+        (.details-section.probe-set .data-grid .object-tree > :matches(.title, .object-preview)::before):
+        Another line-height fix for object tree disclosure triangles.
+
+        * UserInterface/Views/ProbeSetDataGridNode.js:
+        (WebInspector.ProbeSetDataGridNode.prototype.createCellContent):
+        Create an ObjectTree / FormattedValue for the RemoteObject.
+
+        * UserInterface/Views/SourceCodeTextEditor.css:
+        (.popover .debugger-popover-content > .title):
+        (.popover .debugger-popover-content > .body):
+        (.popover .debugger-popover-content.function > .body):
+        Be more specific and don't accidentally style ".title" within the body.
+
+        * UserInterface/Views/SourceCodeTextEditor.js:
+        (WebInspector.SourceCodeTextEditor.prototype._showPopoverForObject):
+        Show a properties only ObjectTree instead of an ObjectPropertiesSection.
+
+        (WebInspector.SourceCodeTextEditor.prototype._showPopoverForString): Deleted.
+        (WebInspector.SourceCodeTextEditor.prototype._showPopoverForRegExp): Deleted.
+        (WebInspector.SourceCodeTextEditor.prototype._showPopoverForNumber): Deleted.
+        (WebInspector.SourceCodeTextEditor.prototype._showPopoverForBoolean): Deleted.
+        (WebInspector.SourceCodeTextEditor.prototype._showPopoverForNull): Deleted.
+        (WebInspector.SourceCodeTextEditor.prototype._showPopoverForUndefined): Deleted.
+        (WebInspector.SourceCodeTextEditor.prototype._showPopoverWithFormattedValue):
+        Reduce most of these to a single popover for formatted values.
+
+2015-03-18  Joseph Pecoraro  <pecoraro@apple.com>
+
         Web Inspector: Scopes sidebar should use new ObjectTreeView and not ObjectPropertiesSection
         https://bugs.webkit.org/show_bug.cgi?id=142808
 
index 4fce26f..fa6c0cf 100644 (file)
@@ -85,3 +85,8 @@
 .details-section.probe-set .data-grid .section {
     left: -6px;
 }
+
+.details-section.probe-set .data-grid .object-tree > :matches(.title, .object-preview)::before {
+ /* The line-height inside a data-grid is 17px instead of 13px, this will center vertically on the top line. */
+    top: 2px;
+}
index e62e24d..3b5b1ba 100644 (file)
@@ -85,22 +85,8 @@ WebInspector.ProbeSetDataGridNode.prototype = {
             return sample;
         }
 
-        if (sample instanceof WebInspector.RemoteObject) {
-            switch (sample.type) {
-            case "function": // FIXME: is there a better way to visualize functions?
-            case "object":
-                return new WebInspector.ObjectPropertiesSection(sample, WebInspector.ProbeSet.SampleObjectTitle).element;
-            case "string":
-            case "number":
-            case "boolean":
-            case "undefined":
-            case "null":
-                return document.createTextNode(sample.value);
-            case "array":
-            // FIXME: reuse existing visualization of arrays here.
-            default: console.log("Don't know how to represent sample:", sample);
-            }
-        }
+        if (sample instanceof WebInspector.RemoteObject)
+            return WebInspector.FormattedValue.createObjectTreeOrFormattedValueForRemoteObject(sample, null);
 
         return sample;
     },
index 472afc2..d088a4b 100644 (file)
     min-height: 250px;
 }
 
-.popover .debugger-popover-content .title {
+.popover .debugger-popover-content .title {
     font-weight: bold;
     padding-left: 10px;
 
     white-space: nowrap;
 }
 
-.popover .debugger-popover-content .body {
+.popover .debugger-popover-content .body {
     border-top: 1px solid rgb(194, 194, 147);
     overflow: auto;
     margin-top: 5px;
     padding-top: 5px;
 }
 
-.popover .debugger-popover-content.function .body {
+.popover .debugger-popover-content.function .body {
     padding-left: 10px;
     padding-right: 10px;
 }
index c0a4c3d..920712e 100644 (file)
@@ -1391,22 +1391,17 @@ WebInspector.SourceCodeTextEditor.prototype = {
                 this._showPopoverForFunction(data);
                 break;
             case "object":
-                if (data.subtype === "regexp") 
-                    this._showPopoverForRegExp(data);
+                if (data.subtype === "null" || data.subtype === "regexp")
+                    this._showPopoverWithFormattedValue(data);
                 else
                     this._showPopoverForObject(data);
                 break;
             case "string":
-                this._showPopoverForString(data);
-                break;
             case "number":
-                this._showPopoverForNumber(data);
-                break;
             case "boolean":
-                this._showPopoverForBoolean(data);
-                break;
             case "undefined":
-                this._showPopoverForUndefined(data);
+            case "symbol":
+                this._showPopoverWithFormattedValue(data);
                 break;
             }
         }
@@ -1520,11 +1515,6 @@ WebInspector.SourceCodeTextEditor.prototype = {
 
     _showPopoverForObject: function(data)
     {
-        if (data.subtype === "null") {
-            this._showPopoverForNull(data);
-            return;
-        }
-
         var content = document.createElement("div");
         content.className = "object expandable";
 
@@ -1533,65 +1523,21 @@ WebInspector.SourceCodeTextEditor.prototype = {
         titleElement.textContent = data.description;
         content.appendChild(titleElement);
 
-        var section = new WebInspector.ObjectPropertiesSection(data);
-        section.expanded = true;
-        section.element.classList.add("body");
-        content.appendChild(section.element);
-
-        this._showPopover(content);
-    },
-
-    _showPopoverForString: function(data)
-    {
-        var content = document.createElement("div");
-        content.className = "string formatted-string";
-        content.textContent = "\"" + data.description + "\"";
-
-        this._showPopover(content);
-    },
-
-    _showPopoverForRegExp: function(data)
-    {
-        var content = document.createElement("div");
-        content.className = "regexp formatted-regexp";
-        content.textContent = data.description;
-
-        this._showPopover(content);
-    },
-
-    _showPopoverForNumber: function(data)
-    {
-        var content = document.createElement("span");
-        content.className = "number formatted-number";
-        content.textContent = data.description;
-
-        this._showPopover(content);
-    },
+        // FIXME: If this is a variable, it would be nice to put the variable name in the PropertyPath.
+        var objectTree = new WebInspector.ObjectTreeView(data, WebInspector.ObjectTreeView.Mode.Properties, null);
+        objectTree.showOnlyProperties();
+        objectTree.expand();
 
-    _showPopoverForBoolean: function(data)
-    {
-        var content = document.createElement("span");
-        content.className = "boolean formatted-boolean";
-        content.textContent = data.description;
+        var bodyElement = content.appendChild(document.createElement("div"));
+        bodyElement.className = "body";
+        bodyElement.appendChild(objectTree.element);
 
         this._showPopover(content);
     },
 
-    _showPopoverForNull: function(data)
+    _showPopoverWithFormattedValue: function(remoteObject)
     {
-        var content = document.createElement("span");
-        content.className = "boolean formatted-null";
-        content.textContent = data.description;
-
-        this._showPopover(content);
-    },
-
-    _showPopoverForUndefined: function(data)
-    {
-        var content = document.createElement("span");
-        content.className = "boolean formatted-undefined";
-        content.textContent = data.description;
-
+        var content = WebInspector.FormattedValue.createElementForRemoteObject(remoteObject);
         this._showPopover(content);
     },