Changeset 48431 in webkit


Ignore:
Timestamp:
Sep 16, 2009 1:16:04 PM (15 years ago)
Author:
eric@webkit.org
Message:

2009-09-16 Patrick Mueller <​Patrick_Mueller@us.ibm.com>

Reviewed by Timothy Hatcher.

Add Watch Expression support to inspector
​https://bugs.webkit.org/show_bug.cgi?id=27514

Manual test added.

  • English.lproj/localizedStrings.js:
  • WebCore.gypi:
  • WebCore.vcproj/WebCore.vcproj:
  • inspector/front-end/ConsoleView.js: (WebInspector.ConsoleView.prototype.completions): (WebInspector.ConsoleView.prototype.evalInInspectedWindow): (WebInspector.ConsoleView.prototype._enterKeyPressed):
  • inspector/front-end/ObjectPropertiesSection.js: (WebInspector.ObjectPropertiesSection.prototype.update.callback): (WebInspector.ObjectPropertiesSection.prototype.update): (WebInspector.ObjectPropertiesSection.prototype.updateProperties): (WebInspector.ObjectPropertiesSection.CompareProperties): (WebInspector.ObjectPropertyTreeElement.prototype.onpopulate.callback): (WebInspector.ObjectPropertyTreeElement.prototype.onpopulate): (WebInspector.ObjectPropertyTreeElement.prototype.update):
  • inspector/front-end/ScriptsPanel.js: (WebInspector.ScriptsPanel): (WebInspector.ScriptsPanel.prototype.reset): (WebInspector.ScriptsPanel.prototype._callFrameSelected):
  • inspector/front-end/WatchExpressionsSidebarPane.js: Added. (WebInspector.WatchExpressionsSidebarPane): (WebInspector.WatchExpressionsSidebarPane.prototype.refreshExpressions): (WebInspector.WatchExpressionsSection): (WebInspector.WatchExpressionsSection.prototype.update): (WebInspector.WatchExpressionsSection.prototype.addExpression): (WebInspector.WatchExpressionsSection.prototype.updateExpression): (WebInspector.WatchExpressionsSection.prototype.findAddedTreeElement): (WebInspector.WatchExpressionsSection.prototype.loadSavedExpressions): (WebInspector.WatchExpressionsSection.prototype.saveExpressions): (WebInspector.WatchExpressionsSection.CompareProperties): (WebInspector.WatchExpressionTreeElement): (WebInspector.WatchExpressionTreeElement.prototype.update): (WebInspector.WatchExpressionTreeElement.prototype._deleteButtonClicked): (WebInspector.WatchExpressionTreeElement.prototype.startEditing): (WebInspector.WatchExpressionTreeElement.prototype.editingCancelled): (WebInspector.WatchExpressionTreeElement.prototype.applyExpression):
  • inspector/front-end/WebKit.qrc:
  • inspector/front-end/inspector.css:
  • inspector/front-end/inspector.html:
  • manual-tests/inspector/debugger-watch-expressions.html: Added.
Location:
trunk/WebCore
Files:
2 added
10 edited

Legend:

Unmodified
Added
Removed

  • trunk/WebCore/ChangeLog

    r48430 r48431  
     12009-09-16  Patrick Mueller  <Patrick_Mueller@us.ibm.com>
     2
     3        Reviewed by Timothy Hatcher.
     4
     5        Add Watch Expression support to inspector
     6        https://bugs.webkit.org/show_bug.cgi?id=27514
     7
     8        Manual test added.
     9
     10        * English.lproj/localizedStrings.js:
     11        * WebCore.gypi:
     12        * WebCore.vcproj/WebCore.vcproj:
     13        * inspector/front-end/ConsoleView.js:
     14        (WebInspector.ConsoleView.prototype.completions):
     15        (WebInspector.ConsoleView.prototype.evalInInspectedWindow):
     16        (WebInspector.ConsoleView.prototype._enterKeyPressed):
     17        * inspector/front-end/ObjectPropertiesSection.js:
     18        (WebInspector.ObjectPropertiesSection.prototype.update.callback):
     19        (WebInspector.ObjectPropertiesSection.prototype.update):
     20        (WebInspector.ObjectPropertiesSection.prototype.updateProperties):
     21        (WebInspector.ObjectPropertiesSection.CompareProperties):
     22        (WebInspector.ObjectPropertyTreeElement.prototype.onpopulate.callback):
     23        (WebInspector.ObjectPropertyTreeElement.prototype.onpopulate):
     24        (WebInspector.ObjectPropertyTreeElement.prototype.update):
     25        * inspector/front-end/ScriptsPanel.js:
     26        (WebInspector.ScriptsPanel):
     27        (WebInspector.ScriptsPanel.prototype.reset):
     28        (WebInspector.ScriptsPanel.prototype._callFrameSelected):
     29        * inspector/front-end/WatchExpressionsSidebarPane.js: Added.
     30        (WebInspector.WatchExpressionsSidebarPane):
     31        (WebInspector.WatchExpressionsSidebarPane.prototype.refreshExpressions):
     32        (WebInspector.WatchExpressionsSection):
     33        (WebInspector.WatchExpressionsSection.prototype.update):
     34        (WebInspector.WatchExpressionsSection.prototype.addExpression):
     35        (WebInspector.WatchExpressionsSection.prototype.updateExpression):
     36        (WebInspector.WatchExpressionsSection.prototype.findAddedTreeElement):
     37        (WebInspector.WatchExpressionsSection.prototype.loadSavedExpressions):
     38        (WebInspector.WatchExpressionsSection.prototype.saveExpressions):
     39        (WebInspector.WatchExpressionsSection.CompareProperties):
     40        (WebInspector.WatchExpressionTreeElement):
     41        (WebInspector.WatchExpressionTreeElement.prototype.update):
     42        (WebInspector.WatchExpressionTreeElement.prototype._deleteButtonClicked):
     43        (WebInspector.WatchExpressionTreeElement.prototype.startEditing):
     44        (WebInspector.WatchExpressionTreeElement.prototype.editingCancelled):
     45        (WebInspector.WatchExpressionTreeElement.prototype.applyExpression):
     46        * inspector/front-end/WebKit.qrc:
     47        * inspector/front-end/inspector.css:
     48        * inspector/front-end/inspector.html:
     49        * manual-tests/inspector/debugger-watch-expressions.html: Added.
     50
    1512009-09-16  Greg Bolsinga  <bolsinga@apple.com>
    252

  • trunk/WebCore/WebCore.gypi

    r48392 r48431  
    35193519            'inspector/front-end/utilities.js',
    35203520            'inspector/front-end/View.js',
     3521            'inspector/front-end/WatchExpressionsSidebarPane.js',
    35213522            'inspector/front-end/inspector.css',
    35223523        ],

  • trunk/WebCore/WebCore.vcproj/WebCore.vcproj

    r48392 r48431  
    3162731627                                        >
    3162831628                                </File>
     31629                                <File
     31630                                        RelativePath="..\inspector\front-end\WatchExpressionsSidebarPane.js"
     31631                                        >
     31632                                </File>
    3162931633                        </Filter>
    3163031634                </Filter>

  • trunk/WebCore/inspector/front-end/ConsoleView.js

    r48314 r48431  
    299299        }
    300300
    301         this._evalInInspectedWindow(
     301        this.evalInInspectedWindow(
    302302            "(function() {" +
    303303                "var props = {};" +
    … …  
    395395    },
    396396
    397     _evalInInspectedWindow: function(expression, callback)
     397    evalInInspectedWindow: function(expression, callback)
    398398    {
    399399        if (WebInspector.panels.scripts && WebInspector.panels.scripts.paused) {
    … …  
    443443            self.addMessage(new WebInspector.ConsoleCommandResult(result, exception, commandMessage));
    444444        }
    445         this._evalInInspectedWindow(str, printResult);
     445        this.evalInInspectedWindow(str, printResult);
    446446    },
    447447

  • trunk/WebCore/inspector/front-end/ObjectPropertiesSection.js

    r48046 r48431  
    4949            if (!properties)
    5050                return;
    51             self._update(properties);
     51            self.updateProperties(properties);
    5252        };
    5353        InjectedScriptAccess.getProperties(this.object, this.ignoreHasOwnProperty, callback);
    5454    },
    5555
    56     _update: function(properties)
    57     {
     56    updateProperties: function(properties, rootTreeElementConstructor, rootPropertyComparer)
     57    {
     58        if (!rootTreeElementConstructor)
     59            rootTreeElementConstructor = this.treeElementConstructor;
     60           
     61        if (!rootPropertyComparer)
     62            rootPropertyComparer = WebInspector.ObjectPropertiesSection.CompareProperties;
     63           
    5864        if (this.extraProperties)
    5965            for (var i = 0; i < this.extraProperties.length; ++i)
    6066                properties.push(this.extraProperties[i]);
    61         properties.sort(this._displaySort);
     67               
     68        properties.sort(rootPropertyComparer);
    6269
    6370        this.propertiesTreeOutline.removeChildren();
    6471
    6572        for (var i = 0; i < properties.length; ++i)
    66             this.propertiesTreeOutline.appendChild(new this.treeElementConstructor(properties[i]));
     73            this.propertiesTreeOutline.appendChild(new rootTreeElementConstructor(properties[i]));
    6774
    6875        if (!this.propertiesTreeOutline.children.length) {
    … …  
    7178            this.propertiesTreeOutline.appendChild(infoElement);
    7279        }
    73     },
    74 
    75     _displaySort: function(propertyA, propertyB) {
    76         var a = propertyA.name;
    77         var b = propertyB.name;
    78 
    79         // if used elsewhere make sure to
    80         //  - convert a and b to strings (not needed here, properties are all strings)
    81         //  - check if a == b (not needed here, no two properties can be the same)
    82 
    83         var diff = 0;
    84         var chunk = /^\d+|^\D+/;
    85         var chunka, chunkb, anum, bnum;
    86         while (diff === 0) {
    87             if (!a && b)
    88                 return -1;
    89             if (!b && a)
    90                 return 1;
    91             chunka = a.match(chunk)[0];
    92             chunkb = b.match(chunk)[0];
    93             anum = !isNaN(chunka);
    94             bnum = !isNaN(chunkb);
    95             if (anum && !bnum)
    96                 return -1;
    97             if (bnum && !anum)
    98                 return 1;
    99             if (anum && bnum) {
    100                 diff = chunka - chunkb;
    101                 if (diff === 0 && chunka.length !== chunkb.length) {
    102                     if (!+chunka && !+chunkb) // chunks are strings of all 0s (special case)
    103                         return chunka.length - chunkb.length;
    104                     else
    105                         return chunkb.length - chunka.length;
    106                 }
    107             } else if (chunka !== chunkb)
    108                 return (chunka < chunkb) ? -1 : 1;
    109             a = a.substring(chunka.length);
    110             b = b.substring(chunkb.length);
    111         }
    112         return diff;
    11380    }
    11481}
    11582
    11683WebInspector.ObjectPropertiesSection.prototype.__proto__ = WebInspector.PropertiesSection.prototype;
     84
     85WebInspector.ObjectPropertiesSection.CompareProperties = function(propertyA, propertyB)
     86{
     87    var a = propertyA.name;
     88    var b = propertyB.name;
     89
     90    // if used elsewhere make sure to
     91    //  - convert a and b to strings (not needed here, properties are all strings)
     92    //  - check if a == b (not needed here, no two properties can be the same)
     93
     94    var diff = 0;
     95    var chunk = /^\d+|^\D+/;
     96    var chunka, chunkb, anum, bnum;
     97    while (diff === 0) {
     98        if (!a && b)
     99            return -1;
     100        if (!b && a)
     101            return 1;
     102        chunka = a.match(chunk)[0];
     103        chunkb = b.match(chunk)[0];
     104        anum = !isNaN(chunka);
     105        bnum = !isNaN(chunkb);
     106        if (anum && !bnum)
     107            return -1;
     108        if (bnum && !anum)
     109            return 1;
     110        if (anum && bnum) {
     111            diff = chunka - chunkb;
     112            if (diff === 0 && chunka.length !== chunkb.length) {
     113                if (!+chunka && !+chunkb) // chunks are strings of all 0s (special case)
     114                    return chunka.length - chunkb.length;
     115                else
     116                    return chunkb.length - chunka.length;
     117            }
     118        } else if (chunka !== chunkb)
     119            return (chunka < chunkb) ? -1 : 1;
     120        a = a.substring(chunka.length);
     121        b = b.substring(chunkb.length);
     122    }
     123    return diff;
     124}
    117125
    118126WebInspector.ObjectPropertyTreeElement = function(property)
    … …  
    130138            return;
    131139
    132         var self = this;
    133140        var callback = function(properties) {
    134             self.removeChildren();
     141            this.removeChildren();
    135142            if (!properties)
    136143                return;
    137144
    138             properties.sort(self._displaySort);
     145            properties.sort(WebInspector.ObjectPropertiesSection.CompareProperties);
    139146            for (var i = 0; i < properties.length; ++i) {
    140                 self.appendChild(new self.treeOutline.section.treeElementConstructor(properties[i]));
     147                this.appendChild(new this.treeOutline.section.treeElementConstructor(properties[i]));
    141148            }
    142149        };
    143         InjectedScriptAccess.getProperties(this.property.value, false, callback);
     150        InjectedScriptAccess.getProperties(this.property.value, false, callback.bind(this));
    144151    },
    145152
    … …  
    156163    update: function()
    157164    {
    158         var nameElement = document.createElement("span");
    159         nameElement.className = "name";
    160         nameElement.textContent = this.property.name;
    161 
     165        this.nameElement = document.createElement("span");
     166        this.nameElement.className = "name";
     167        this.nameElement.textContent = this.property.name;
     168
     169        var separatorElement = document.createElement("span");
     170        separatorElement.className = "separator";
     171        separatorElement.textContent = ": ";
     172       
    162173        this.valueElement = document.createElement("span");
    163174        this.valueElement.className = "value";
    … …  
    168179        this.listItemElement.removeChildren();
    169180
    170         this.listItemElement.appendChild(nameElement);
    171         this.listItemElement.appendChild(document.createTextNode(": "));
     181        this.listItemElement.appendChild(this.nameElement);
     182        this.listItemElement.appendChild(separatorElement);
    172183        this.listItemElement.appendChild(this.valueElement);
    173184        this.hasChildren = this.property.value.hasChildren;

  • trunk/WebCore/inspector/front-end/ScriptsPanel.js

    r48046 r48431  
    127127
    128128    this.sidebarPanes = {};
     129    this.sidebarPanes.watchExpressions = new WebInspector.WatchExpressionsSidebarPane();
    129130    this.sidebarPanes.callstack = new WebInspector.CallStackSidebarPane();
    130131    this.sidebarPanes.scopechain = new WebInspector.ScopeChainSidebarPane();
    … …  
    472473
    473474        this._sourceIDMap = {};
     475       
     476        this.sidebarPanes.watchExpressions.refreshExpressions();
    474477    },
    475478
    … …  
    705708
    706709        this.sidebarPanes.scopechain.update(currentFrame);
     710        this.sidebarPanes.watchExpressions.refreshExpressions();
    707711
    708712        var scriptOrResource = this._sourceIDMap[currentFrame.sourceID];

  • trunk/WebCore/inspector/front-end/WebKit.qrc

    r48392 r48431  
    6363    <file>utilities.js</file>
    6464    <file>View.js</file>
     65    <file>WatchExpressionsSidebarPane.js</file>
    6566    <file>inspector.css</file>
    6667    <file>Images/back.png</file>

  • trunk/WebCore/inspector/front-end/inspector.css

    r48314 r48431  
    12071207}
    12081208
     1209.watch-expressions-buttons-container {
     1210    text-align: center;
     1211}
     1212
    12091213.section .header {
    12101214    padding: 2px 8px 4px 18px;
    … …  
    13731377}
    13741378
    1375 li.editing .swatch, li.editing .enabled-button {
     1379li.editing .swatch, li.editing .enabled-button,  li.editing-sub-part .delete-button {
    13761380    display: none !important;
     1381}
     1382
     1383.watch-expressions > li.editing-sub-part .name {
     1384    display: block;
     1385    width: 100%;
     1386}
     1387
     1388.watch-expressions > li.editing-sub-part .value, .watch-expressions > li.editing-sub-part .separator  {
     1389    display: none;
    13771390}
    13781391
    … …  
    14081421    position: relative;
    14091422    z-index: 1;
     1423}
     1424
     1425/* FIXME: need a better icon (comment in bug 27514) */
     1426.section .properties .delete-button {
     1427    width: 10px;
     1428    height: 10px;
     1429    background-image: url(Images/errorIcon.png);
     1430    background-position: 0 0;
     1431    background-color: transparent;
     1432    background-repeat: no-repeat;
     1433    border: 0 none transparent;
    14101434}
    14111435

  • trunk/WebCore/inspector/front-end/inspector.html

    r48392 r48431  
    6363    <script type="text/javascript" src="CallStackSidebarPane.js"></script>
    6464    <script type="text/javascript" src="ScopeChainSidebarPane.js"></script>
     65    <script type="text/javascript" src="WatchExpressionsSidebarPane.js"></script>
    6566    <script type="text/javascript" src="MetricsSidebarPane.js"></script>
    6667    <script type="text/javascript" src="PropertiesSidebarPane.js"></script>
Note: See TracChangeset for help on using the changeset viewer.