⚠ Archived content — this site is no longer maintained.   Current WebKit documentation is at docs.webkit.org.

Changeset 181722 in webkit


Ignore:
Timestamp:
Mar 18, 2015, 8:26:55 PM (11 years ago)
Author:
Joseph Pecoraro
Message:

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.

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.

Location:
trunk/Source
Files:
7 edited

Legend:

Unmodified
Added
Removed

  • trunk/Source/JavaScriptCore/ChangeLog

    r181681 r181722  
     12015-03-18  Joseph Pecoraro  <pecoraro@apple.com>
     2
     3        Web Inspector: Debugger Popovers and Probes should use FormattedValue/ObjectTreeView instead of Custom/ObjectPropertiesSection
     4        https://bugs.webkit.org/show_bug.cgi?id=142830
     5
     6        Reviewed by Timothy Hatcher.
     7
     8        * inspector/agents/InspectorDebuggerAgent.cpp:
     9        (Inspector::InspectorDebuggerAgent::breakpointActionProbe):
     10        Give Probe Samples object previews.
     11
    1122015-03-17  Ryuan Choi  <ryuan.choi@navercorp.com>
    213

  • trunk/Source/JavaScriptCore/inspector/agents/InspectorDebuggerAgent.cpp

    r180715 r181722  
    728728{
    729729    InjectedScript injectedScript = m_injectedScriptManager->injectedScriptFor(scriptState);
    730     RefPtr<Protocol::Runtime::RemoteObject> payload = injectedScript.wrapObject(sample, objectGroupForBreakpointAction(action));
     730    RefPtr<Protocol::Runtime::RemoteObject> payload = injectedScript.wrapObject(sample, objectGroupForBreakpointAction(action), true);
    731731    auto result = Protocol::Debugger::ProbeSample::create()
    732732        .setProbeId(action.identifier)

  • trunk/Source/WebInspectorUI/ChangeLog

    r181704 r181722  
     12015-03-18  Joseph Pecoraro  <pecoraro@apple.com>
     2
     3        Web Inspector: Debugger Popovers and Probes should use FormattedValue/ObjectTreeView instead of Custom/ObjectPropertiesSection
     4        https://bugs.webkit.org/show_bug.cgi?id=142830
     5
     6        Reviewed by Timothy Hatcher.
     7
     8        * UserInterface/Views/ProbeSetDataGrid.css:
     9        (.details-section.probe-set .data-grid .object-tree > :matches(.title, .object-preview)::before):
     10        Another line-height fix for object tree disclosure triangles.
     11
     12        * UserInterface/Views/ProbeSetDataGridNode.js:
     13        (WebInspector.ProbeSetDataGridNode.prototype.createCellContent):
     14        Create an ObjectTree / FormattedValue for the RemoteObject.
     15
     16        * UserInterface/Views/SourceCodeTextEditor.css:
     17        (.popover .debugger-popover-content > .title):
     18        (.popover .debugger-popover-content > .body):
     19        (.popover .debugger-popover-content.function > .body):
     20        Be more specific and don't accidentally style ".title" within the body.
     21
     22        * UserInterface/Views/SourceCodeTextEditor.js:
     23        (WebInspector.SourceCodeTextEditor.prototype._showPopoverForObject):
     24        Show a properties only ObjectTree instead of an ObjectPropertiesSection.
     25
     26        (WebInspector.SourceCodeTextEditor.prototype._showPopoverForString): Deleted.
     27        (WebInspector.SourceCodeTextEditor.prototype._showPopoverForRegExp): Deleted.
     28        (WebInspector.SourceCodeTextEditor.prototype._showPopoverForNumber): Deleted.
     29        (WebInspector.SourceCodeTextEditor.prototype._showPopoverForBoolean): Deleted.
     30        (WebInspector.SourceCodeTextEditor.prototype._showPopoverForNull): Deleted.
     31        (WebInspector.SourceCodeTextEditor.prototype._showPopoverForUndefined): Deleted.
     32        (WebInspector.SourceCodeTextEditor.prototype._showPopoverWithFormattedValue):
     33        Reduce most of these to a single popover for formatted values.
     34
    1352015-03-18  Joseph Pecoraro  <pecoraro@apple.com>
    236

  • trunk/Source/WebInspectorUI/UserInterface/Views/ProbeSetDataGrid.css

    r172399 r181722  
    8686    left: -6px;
    8787}
     88
     89.details-section.probe-set .data-grid .object-tree > :matches(.title, .object-preview)::before {
     90 /* The line-height inside a data-grid is 17px instead of 13px, this will center vertically on the top line. */
     91    top: 2px;
     92}

  • trunk/Source/WebInspectorUI/UserInterface/Views/ProbeSetDataGridNode.js

    r164543 r181722  
    8686        }
    8787
    88         if (sample instanceof WebInspector.RemoteObject) {
    89             switch (sample.type) {
    90             case "function": // FIXME: is there a better way to visualize functions?
    91             case "object":
    92                 return new WebInspector.ObjectPropertiesSection(sample, WebInspector.ProbeSet.SampleObjectTitle).element;
    93             case "string":
    94             case "number":
    95             case "boolean":
    96             case "undefined":
    97             case "null":
    98                 return document.createTextNode(sample.value);
    99             case "array":
    100             // FIXME: reuse existing visualization of arrays here.
    101             default: console.log("Don't know how to represent sample:", sample);
    102             }
    103         }
     88        if (sample instanceof WebInspector.RemoteObject)
     89            return WebInspector.FormattedValue.createObjectTreeOrFormattedValueForRemoteObject(sample, null);
    10490
    10591        return sample;

  • trunk/Source/WebInspectorUI/UserInterface/Views/SourceCodeTextEditor.css

    r181306 r181722  
    139139}
    140140
    141 .popover .debugger-popover-content .title {
     141.popover .debugger-popover-content > .title {
    142142    font-weight: bold;
    143143    padding-left: 10px;
    … …  
    148148}
    149149
    150 .popover .debugger-popover-content .body {
     150.popover .debugger-popover-content > .body {
    151151    border-top: 1px solid rgb(194, 194, 147);
    152152    overflow: auto;
    … …  
    155155}
    156156
    157 .popover .debugger-popover-content.function .body {
     157.popover .debugger-popover-content.function > .body {
    158158    padding-left: 10px;
    159159    padding-right: 10px;

  • trunk/Source/WebInspectorUI/UserInterface/Views/SourceCodeTextEditor.js

    r181306 r181722  
    13921392                break;
    13931393            case "object":
    1394                 if (data.subtype === "regexp")
    1395                     this._showPopoverForRegExp(data);
     1394                if (data.subtype === "null" || data.subtype === "regexp")
     1395                    this._showPopoverWithFormattedValue(data);
    13961396                else
    13971397                    this._showPopoverForObject(data);
    13981398                break;
    13991399            case "string":
    1400                 this._showPopoverForString(data);
    1401                 break;
    14021400            case "number":
    1403                 this._showPopoverForNumber(data);
    1404                 break;
    14051401            case "boolean":
    1406                 this._showPopoverForBoolean(data);
    1407                 break;
    14081402            case "undefined":
    1409                 this._showPopoverForUndefined(data);
     1403            case "symbol":
     1404                this._showPopoverWithFormattedValue(data);
    14101405                break;
    14111406            }
    … …  
    15211516    _showPopoverForObject: function(data)
    15221517    {
    1523         if (data.subtype === "null") {
    1524             this._showPopoverForNull(data);
    1525             return;
    1526         }
    1527 
    15281518        var content = document.createElement("div");
    15291519        content.className = "object expandable";
    … …  
    15341524        content.appendChild(titleElement);
    15351525
    1536         var section = new WebInspector.ObjectPropertiesSection(data);
    1537         section.expanded = true;
    1538         section.element.classList.add("body");
    1539         content.appendChild(section.element);
     1526        // FIXME: If this is a variable, it would be nice to put the variable name in the PropertyPath.
     1527        var objectTree = new WebInspector.ObjectTreeView(data, WebInspector.ObjectTreeView.Mode.Properties, null);
     1528        objectTree.showOnlyProperties();
     1529        objectTree.expand();
     1530
     1531        var bodyElement = content.appendChild(document.createElement("div"));
     1532        bodyElement.className = "body";
     1533        bodyElement.appendChild(objectTree.element);
    15401534
    15411535        this._showPopover(content);
    15421536    },
    15431537
    1544     _showPopoverForString: function(data)
    1545     {
    1546         var content = document.createElement("div");
    1547         content.className = "string formatted-string";
    1548         content.textContent = "\"" + data.description + "\"";
    1549 
    1550         this._showPopover(content);
    1551     },
    1552 
    1553     _showPopoverForRegExp: function(data)
    1554     {
    1555         var content = document.createElement("div");
    1556         content.className = "regexp formatted-regexp";
    1557         content.textContent = data.description;
    1558 
    1559         this._showPopover(content);
    1560     },
    1561 
    1562     _showPopoverForNumber: function(data)
    1563     {
    1564         var content = document.createElement("span");
    1565         content.className = "number formatted-number";
    1566         content.textContent = data.description;
    1567 
    1568         this._showPopover(content);
    1569     },
    1570 
    1571     _showPopoverForBoolean: function(data)
    1572     {
    1573         var content = document.createElement("span");
    1574         content.className = "boolean formatted-boolean";
    1575         content.textContent = data.description;
    1576 
    1577         this._showPopover(content);
    1578     },
    1579 
    1580     _showPopoverForNull: function(data)
    1581     {
    1582         var content = document.createElement("span");
    1583         content.className = "boolean formatted-null";
    1584         content.textContent = data.description;
    1585 
    1586         this._showPopover(content);
    1587     },
    1588 
    1589     _showPopoverForUndefined: function(data)
    1590     {
    1591         var content = document.createElement("span");
    1592         content.className = "boolean formatted-undefined";
    1593         content.textContent = data.description;
    1594 
     1538    _showPopoverWithFormattedValue: function(remoteObject)
     1539    {
     1540        var content = WebInspector.FormattedValue.createElementForRemoteObject(remoteObject);
    15951541        this._showPopover(content);
    15961542    },
Note: See TracChangeset for help on using the changeset viewer.