Changeset 70989 in webkit


Ignore:
Timestamp:
Oct 30, 2010 11:43:11 PM (14 years ago)
Author:
pfeldman@chromium.org
Message:

2010-10-30 Pavel Feldman <pfeldman@chromium.org>

Reviewed by Timothy Hatcher.

Web Inspector: new resources and network panel usability improvements.
https://bugs.webkit.org/show_bug.cgi?id=48680

By default, navigation clears network log, added 'preserve log' button,
that prevents log from being cleared.

Storing expanded state of all group items, restoring last selected item,
fall back to main frame's main resource by default.
Do not list XHRs and redirects in resources.

  • English.lproj/localizedStrings.js:
  • inspector/InspectorController.cpp: (WebCore::InspectorController::didLoadResourceFromMemoryCache): (WebCore::InspectorController::identifierForInitialRequest):
  • inspector/front-end/NetworkPanel.js: (WebInspector.NetworkPanel.prototype.get statusBarItems): (WebInspector.NetworkPanel.prototype._positionSummaryBar): (WebInspector.NetworkPanel.prototype._updateFilter): (WebInspector.NetworkPanel.prototype._createStatusbarButtons): (WebInspector.NetworkPanel.prototype._onPreserveLogClicked): (WebInspector.NetworkPanel.prototype.reset): (WebInspector.NetworkPanel.prototype.refreshResource):
  • inspector/front-end/ResourceManager.js: (WebInspector.ResourceManager.prototype.identifierForInitialRequest): (WebInspector.ResourceManager.prototype.willSendRequest): (WebInspector.ResourceManager.prototype.didLoadResourceFromMemoryCache): (WebInspector.ResourceManager.prototype.setOverrideContent): (WebInspector.ResourceManager.prototype.didCreateWebSocket):
  • inspector/front-end/StoragePanel.js: (WebInspector.StoragePanel): (WebInspector.StoragePanel.prototype.show): (WebInspector.StoragePanel.prototype._initDefaultSelection): (WebInspector.StoragePanel.prototype.reset): (WebInspector.StoragePanel.prototype.addResourceToFrame): (WebInspector.StoragePanel.prototype.refreshResource): (WebInspector.StoragePanel.prototype.showDatabase): (WebInspector.BaseStorageTreeElement.prototype.onselect): (WebInspector.StorageCategoryTreeElement): (WebInspector.StorageCategoryTreeElement.prototype.get itemURL): (WebInspector.StorageCategoryTreeElement.prototype.onselect): (WebInspector.StorageCategoryTreeElement.prototype.onattach): (WebInspector.StorageCategoryTreeElement.prototype.onexpand): (WebInspector.StorageCategoryTreeElement.prototype.oncollapse): (WebInspector.FrameTreeElement.prototype.get itemURL): (WebInspector.FrameTreeElement.prototype.onselect): (WebInspector.FrameResourceTreeElement.prototype.get itemURL): (WebInspector.FrameResourceTreeElement.prototype.onselect): (WebInspector.DatabaseTreeElement.prototype.get itemURL): (WebInspector.DatabaseTreeElement.prototype.onselect): (WebInspector.DatabaseTableTreeElement.prototype.get itemURL): (WebInspector.DatabaseTableTreeElement.prototype.onselect): (WebInspector.DOMStorageTreeElement.prototype.get itemURL): (WebInspector.DOMStorageTreeElement.prototype.onselect): (WebInspector.CookieTreeElement.prototype.get itemURL): (WebInspector.CookieTreeElement.prototype.onselect): (WebInspector.ApplicationCacheTreeElement.prototype.get itemURL): (WebInspector.ApplicationCacheTreeElement.prototype.onselect):
Location:
trunk/WebCore
Files:
6 edited

Legend:

Unmodified
Added
Removed
  • trunk/WebCore/ChangeLog

    r70986 r70989  
     12010-10-30  Pavel Feldman  <pfeldman@chromium.org>
     2
     3        Reviewed by Timothy Hatcher.
     4
     5        Web Inspector: new resources and network panel usability improvements.
     6        https://bugs.webkit.org/show_bug.cgi?id=48680
     7
     8        By default, navigation clears network log, added 'preserve log' button,
     9        that prevents log from being cleared.
     10
     11        Storing expanded state of all group items, restoring last selected item,
     12        fall back to main frame's main resource by default.
     13        Do not list XHRs and redirects in resources.
     14
     15        * English.lproj/localizedStrings.js:
     16        * inspector/InspectorController.cpp:
     17        (WebCore::InspectorController::didLoadResourceFromMemoryCache):
     18        (WebCore::InspectorController::identifierForInitialRequest):
     19        * inspector/front-end/NetworkPanel.js:
     20        (WebInspector.NetworkPanel.prototype.get statusBarItems):
     21        (WebInspector.NetworkPanel.prototype._positionSummaryBar):
     22        (WebInspector.NetworkPanel.prototype._updateFilter):
     23        (WebInspector.NetworkPanel.prototype._createStatusbarButtons):
     24        (WebInspector.NetworkPanel.prototype._onPreserveLogClicked):
     25        (WebInspector.NetworkPanel.prototype.reset):
     26        (WebInspector.NetworkPanel.prototype.refreshResource):
     27        * inspector/front-end/ResourceManager.js:
     28        (WebInspector.ResourceManager.prototype.identifierForInitialRequest):
     29        (WebInspector.ResourceManager.prototype.willSendRequest):
     30        (WebInspector.ResourceManager.prototype.didLoadResourceFromMemoryCache):
     31        (WebInspector.ResourceManager.prototype.setOverrideContent):
     32        (WebInspector.ResourceManager.prototype.didCreateWebSocket):
     33        * inspector/front-end/StoragePanel.js:
     34        (WebInspector.StoragePanel):
     35        (WebInspector.StoragePanel.prototype.show):
     36        (WebInspector.StoragePanel.prototype._initDefaultSelection):
     37        (WebInspector.StoragePanel.prototype.reset):
     38        (WebInspector.StoragePanel.prototype.addResourceToFrame):
     39        (WebInspector.StoragePanel.prototype.refreshResource):
     40        (WebInspector.StoragePanel.prototype.showDatabase):
     41        (WebInspector.BaseStorageTreeElement.prototype.onselect):
     42        (WebInspector.StorageCategoryTreeElement):
     43        (WebInspector.StorageCategoryTreeElement.prototype.get itemURL):
     44        (WebInspector.StorageCategoryTreeElement.prototype.onselect):
     45        (WebInspector.StorageCategoryTreeElement.prototype.onattach):
     46        (WebInspector.StorageCategoryTreeElement.prototype.onexpand):
     47        (WebInspector.StorageCategoryTreeElement.prototype.oncollapse):
     48        (WebInspector.FrameTreeElement.prototype.get itemURL):
     49        (WebInspector.FrameTreeElement.prototype.onselect):
     50        (WebInspector.FrameResourceTreeElement.prototype.get itemURL):
     51        (WebInspector.FrameResourceTreeElement.prototype.onselect):
     52        (WebInspector.DatabaseTreeElement.prototype.get itemURL):
     53        (WebInspector.DatabaseTreeElement.prototype.onselect):
     54        (WebInspector.DatabaseTableTreeElement.prototype.get itemURL):
     55        (WebInspector.DatabaseTableTreeElement.prototype.onselect):
     56        (WebInspector.DOMStorageTreeElement.prototype.get itemURL):
     57        (WebInspector.DOMStorageTreeElement.prototype.onselect):
     58        (WebInspector.CookieTreeElement.prototype.get itemURL):
     59        (WebInspector.CookieTreeElement.prototype.onselect):
     60        (WebInspector.ApplicationCacheTreeElement.prototype.get itemURL):
     61        (WebInspector.ApplicationCacheTreeElement.prototype.onselect):
     62
    1632010-10-30  Patrick Gansterer  <paroga@webkit.org>
    264
  • trunk/WebCore/inspector/InspectorController.cpp

    r70956 r70989  
    909909        return;
    910910
     911    ensureSettingsLoaded();
     912
    911913#if LEGACY_RESOURCE_TRACKING_ENABLED
    912914    // If the resource URL is already known, we don't need to add it again since this is just a cached load.
     
    916918    ASSERT(m_inspectedPage);
    917919    bool isMainResource = isMainResourceLoader(loader, KURL(ParsedURLString, cachedResource->url()));
    918     ensureSettingsLoaded();
    919920    if (!isMainResource && !resourceTrackingEnabled())
    920921        return;
     
    947948        m_mainResourceIdentifier = identifier;
    948949
    949 #if LEGACY_RESOURCE_TRACKING_ENABLED
    950 
    951950    ensureSettingsLoaded();
     951
     952#if LEGACY_RESOURCE_TRACKING_ENABLED
    952953    if (!isMainResource && !resourceTrackingEnabled())
    953954        return;
  • trunk/WebCore/inspector/front-end/NetworkPanel.js

    r70879 r70989  
    8484    get statusBarItems()
    8585    {
    86         return [this._largerResourcesButton.element, this._clearButton.element, this._filterBarElement];
     86        return [this._largerResourcesButton.element, this._preserveLogToggle.element, this._clearButton.element, this._filterBarElement];
    8787    },
    8888
     
    127127    {
    128128        // Position the total bar.
    129         const rowHeight = 22;
    130         const summaryBarHeight = 22;
    131         var offsetHeight = this.element.offsetHeight;
    132 
    133         var parentElement = this._summaryBarElement.parentElement;
    134 
    135         if (this._summaryBarElement.parentElement !== this.element && offsetHeight > (this._dataGrid.children.length - 1) * rowHeight + summaryBarHeight) {
     129
     130        var fillerRow = this._dataGrid.dataTableBody.lastChild;
     131        if (this._summaryBarElement.parentElement !== this.element && fillerRow.offsetHeight > 0) {
    136132            // Glue status to bottom.
    137133            if (this._summaryBarRowNode) {
     
    145141        }
    146142
    147         if (!this._summaryBarRowNode && offsetHeight - summaryBarHeight < this._dataGrid.children.length * rowHeight) {
     143        if (!this._summaryBarRowNode && !fillerRow.offsetHeight) {
    148144            // Glue status to table.
    149145            this._summaryBarRowNode = new WebInspector.NetworkTotalGridNode(this._summaryBarElement);
     
    428424
    429425        this._filter(e.target, selectMultiple);
    430 
    431         var searchField = document.getElementById("search");
    432         WebInspector.doPerformSearch(searchField.value, WebInspector.shortSearchWasForcedByKeyEvent, false, true);
     426        this._positionSummaryBar();
    433427    },
    434428
     
    612606    _createStatusbarButtons: function()
    613607    {
     608        this._preserveLogToggle = new WebInspector.StatusBarButton(WebInspector.UIString("Preserve Log upon Navigation"), "record-profile-status-bar-item");
     609        this._preserveLogToggle.addEventListener("click", this._onPreserveLogClicked.bind(this), false);
     610
    614611        this._clearButton = new WebInspector.StatusBarButton(WebInspector.UIString("Clear"), "clear-status-bar-item");
    615612        this._clearButton.addEventListener("click", this._reset.bind(this), false);
     
    748745    },
    749746
     747    _onPreserveLogClicked: function(e)
     748    {
     749        this._preserveLogToggle.toggled = !this._preserveLogToggle.toggled;
     750    },
     751
     752    reset: function()
     753    {
     754        if (!this._preserveLogToggle.toggled)
     755            this._reset();
     756    },
     757
    750758    _reset: function()
    751759    {
     
    781789    },
    782790
    783     addResource: function(resource)
    784     {
    785         this._resources.push(resource);
     791    refreshResource: function(resource)
     792    {
    786793        if (!resource.identifier)
    787794            resource.identifier = "network:" + this._lastIdentifier++;
    788         this._resourcesById[resource.identifier] = resource;
    789         this.refreshResource(resource);
    790     },
    791 
    792     refreshResource: function(resource)
    793     {
     795
     796        if (!this._resourcesById[resource.identifier]) {
     797            this._resources.push(resource);
     798            this._resourcesById[resource.identifier] = resource;
     799
     800            // Pull all the redirects of the main resource upon commit load.
     801            if (resource.redirects) {
     802                for (var i = 0; i < resource.redirects.length; ++i)
     803                    this.refreshResource(resource.redirects[i]);
     804            }
     805        }
     806
    794807        this._staleResources.push(resource);
    795808        this._scheduleRefresh();
  • trunk/WebCore/inspector/front-end/ResourceManager.js

    r70879 r70989  
    7272        this._bindResourceURL(resource);
    7373
    74         WebInspector.panels.network.addResource(resource);
     74        WebInspector.panels.network.refreshResource(resource);
    7575        WebInspector.panels.audits.resourceStarted(resource);
    7676    },
     
    105105
    106106        if (isRedirect) {
    107             WebInspector.panels.network.addResource(resource);
     107            WebInspector.panels.network.refreshResource(resource);
    108108            WebInspector.panels.audits.resourceStarted(resource);
    109109        } else
     
    231231        resource.startTime = resource.responseReceivedTime = resource.endTime = time;
    232232
    233         WebInspector.panels.network.addResource(resource);
     233        WebInspector.panels.network.refreshResource(resource);
    234234        WebInspector.panels.audits.resourceStarted(resource);
    235235        WebInspector.panels.audits.resourceFinished(resource);
     
    252252        resource.type = WebInspector.Resource.Type[type];
    253253        resource.content = sourceString;
     254        WebInspector.panels.storage.refreshResource(resource);
    254255        WebInspector.panels.network.refreshResource(resource);
    255256    },
     
    271272        resource.type = WebInspector.Resource.Type.WebSocket;
    272273
    273         WebInspector.panels.network.addResource(resource);
     274        WebInspector.panels.network.refreshResource(resource);
    274275    },
    275276
  • trunk/WebCore/inspector/front-end/Settings.js

    r70956 r70989  
    7171    installApplicationSetting: function(key, defaultValue)
    7272    {
     73        if (key in this)
     74            return;
     75
    7376        this.__defineGetter__(key, this._get.bind(this, key, defaultValue));
    7477        this.__defineSetter__(key, this._set.bind(this, key));
  • trunk/WebCore/inspector/front-end/StoragePanel.js

    r70956 r70989  
    3232    WebInspector.Panel.call(this, "storage");
    3333
     34    WebInspector.applicationSettings.installApplicationSetting("resourcesLastSelectedItem", {});
     35
    3436    this.createSidebar();
    3537    this.sidebarElement.addStyleClass("outline-disclosure filter-all children small");
     
    3739
    3840    if (Preferences.networkPanelEnabled) {
    39         this.resourcesListTreeElement = new WebInspector.StorageCategoryTreeElement(this, WebInspector.UIString("Frames"), "frame-storage-tree-item");
     41        this.resourcesListTreeElement = new WebInspector.StorageCategoryTreeElement(this, WebInspector.UIString("Frames"), "Frames", "frame-storage-tree-item");
    4042        this.sidebarTree.appendChild(this.resourcesListTreeElement);
    41         this.resourcesListTreeElement.expand();
    4243        this._treeElementForFrameId = {};
    4344    }
    4445
    45     this.databasesListTreeElement = new WebInspector.StorageCategoryTreeElement(this, WebInspector.UIString("Databases"), "database-storage-tree-item");
     46    this.databasesListTreeElement = new WebInspector.StorageCategoryTreeElement(this, WebInspector.UIString("Databases"), "Databases", "database-storage-tree-item");
    4647    this.sidebarTree.appendChild(this.databasesListTreeElement);
    47     this.databasesListTreeElement.expand();
    48 
    49     this.localStorageListTreeElement = new WebInspector.StorageCategoryTreeElement(this, WebInspector.UIString("Local Storage"), "domstorage-storage-tree-item local-storage");
     48
     49    this.localStorageListTreeElement = new WebInspector.StorageCategoryTreeElement(this, WebInspector.UIString("Local Storage"), "LocalStorage", "domstorage-storage-tree-item local-storage");
    5050    this.sidebarTree.appendChild(this.localStorageListTreeElement);
    51     this.localStorageListTreeElement.expand();
    52 
    53     this.sessionStorageListTreeElement = new WebInspector.StorageCategoryTreeElement(this, WebInspector.UIString("Session Storage"), "domstorage-storage-tree-item session-storage");
     51
     52    this.sessionStorageListTreeElement = new WebInspector.StorageCategoryTreeElement(this, WebInspector.UIString("Session Storage"), "SessionStorage", "domstorage-storage-tree-item session-storage");
    5453    this.sidebarTree.appendChild(this.sessionStorageListTreeElement);
    55     this.sessionStorageListTreeElement.expand();
    56 
    57     this.cookieListTreeElement = new WebInspector.StorageCategoryTreeElement(this, WebInspector.UIString("Cookies"), "cookie-storage-tree-item");
     54
     55    this.cookieListTreeElement = new WebInspector.StorageCategoryTreeElement(this, WebInspector.UIString("Cookies"), "Cookies", "cookie-storage-tree-item");
    5856    this.sidebarTree.appendChild(this.cookieListTreeElement);
    59     this.cookieListTreeElement.expand();
    60    
    61     this.applicationCacheListTreeElement = new WebInspector.StorageCategoryTreeElement(this, WebInspector.UIString("Application Cache"), "application-cache-storage-tree-item");
     57
     58    this.applicationCacheListTreeElement = new WebInspector.StorageCategoryTreeElement(this, WebInspector.UIString("Application Cache"), "ApplicationCache", "application-cache-storage-tree-item");
    6259    this.sidebarTree.appendChild(this.applicationCacheListTreeElement);
    63     this.applicationCacheListTreeElement.expand();
    6460
    6561    if (Preferences.fileSystemEnabled) {
     
    7975    this._domStorage = [];
    8076    this._cookieViews = {};
     77    this._domains = {};
    8178}
    8279
     
    9289    },
    9390
     91    show: function()
     92    {
     93        WebInspector.Panel.prototype.show.call(this);
     94        if (this._initializedDefaultSelection)
     95            return;
     96
     97        this._initializedDefaultSelection = true;
     98        var itemURL = WebInspector.applicationSettings.resourcesLastSelectedItem;
     99        if (itemURL) {
     100            for (var treeElement = this.sidebarTree.children[0]; treeElement; treeElement = treeElement.traverseNextTreeElement(false, this.sidebarTree, true)) {
     101                if (treeElement.itemURL === itemURL) {
     102                    treeElement.select();
     103                    treeElement.reveal();
     104                    return;
     105                }
     106            }
     107        }
     108        this._initDefaultSelection();
     109    },
     110
     111    _initDefaultSelection: function()
     112    {
     113        if (WebInspector.mainResource && this.resourcesListTreeElement && this.resourcesListTreeElement.expanded)
     114            this.showResource(WebInspector.mainResource);
     115    },
     116
    94117    reset: function()
    95118    {
     119        this._domains = {};
    96120        for (var i = 0; i < this._databases.length; ++i) {
    97121            var database = this._databases[i];
     
    175199    addResourceToFrame: function(frameId, resource)
    176200    {
     201        if (!this._domains[resource.domain]) {
     202            this._domains[resource.domain] = true;
     203            this.addCookieDomain(resource.domain);
     204            this.addApplicationCache(resource.domain);
     205        }
     206
     207        if (resource.statusCode >= 301 && resource.statusCode <= 303)
     208            return;
     209
    177210        var frameTreeElement = this._treeElementForFrameId[frameId];
    178211        if (!frameTreeElement) {
     
    205238        if (frameTreeElement)
    206239            frameTreeElement.removeChildren();
     240    },
     241
     242    refreshResource: function(resource)
     243    {
     244        // FIXME: do not add XHR in the first place based on the native instrumentation.
     245        if (resource.type === WebInspector.Resource.Type.XHR) {
     246            var resourceTreeElement = this._findTreeElementForResource(resource);
     247            resourceTreeElement.parent.removeChild(resourceTreeElement);
     248        }
    207249    },
    208250
     
    307349        if (!database)
    308350            return;
    309 
     351           
    310352        var view;
    311353        if (tableName) {
     
    684726    },
    685727
     728    onselect: function()
     729    {
     730        var itemURL = this.itemURL;
     731        if (itemURL)
     732            WebInspector.applicationSettings.resourcesLastSelectedItem = itemURL;
     733    },
     734
    686735    onreveal: function()
    687736    {
     
    709758WebInspector.BaseStorageTreeElement.prototype.__proto__ = TreeElement.prototype;
    710759
    711 WebInspector.StorageCategoryTreeElement = function(storagePanel, categoryName, iconClass)
     760WebInspector.StorageCategoryTreeElement = function(storagePanel, categoryName, settingsKey, iconClass)
    712761{
    713762    WebInspector.BaseStorageTreeElement.call(this, storagePanel, null, categoryName, iconClass, true);
     763    this._expandedSettingKey = "resources" + settingsKey + "Expanded";
     764    WebInspector.applicationSettings.installApplicationSetting(this._expandedSettingKey, settingsKey === "Frames");
    714765    this._categoryName = categoryName;
    715766}
    716767
    717768WebInspector.StorageCategoryTreeElement.prototype = {
     769    get itemURL()
     770    {
     771        return "category://" + this._categoryName;
     772    },
     773
    718774    onselect: function()
    719775    {
     776        WebInspector.BaseStorageTreeElement.prototype.onselect.call(this);
    720777        this._storagePanel.showCategoryView(this._categoryName);
     778    },
     779
     780    onattach: function()
     781    {
     782        WebInspector.BaseStorageTreeElement.prototype.onattach.call(this);
     783        if (WebInspector.applicationSettings[this._expandedSettingKey])
     784            this.expand();
     785    },
     786
     787    onexpand: function()
     788    {
     789        WebInspector.applicationSettings[this._expandedSettingKey] = true;
     790    },
     791
     792    oncollapse: function()
     793    {
     794        WebInspector.applicationSettings[this._expandedSettingKey] = false;
    721795    }
    722796}
     
    731805
    732806WebInspector.FrameTreeElement.prototype = {
     807    get itemURL()
     808    {
     809        return "frame://" + encodeURI(this._displayName);
     810    },
     811
    733812    onselect: function()
    734813    {
     814        WebInspector.BaseStorageTreeElement.prototype.onselect.call(this);
    735815        this._storagePanel.showCategoryView(this._displayName);
    736816    },
     
    758838
    759839WebInspector.FrameResourceTreeElement.prototype = {
     840    get itemURL()
     841    {
     842        return this._resource.url;
     843    },
     844
    760845    onselect: function()
    761846    {
     847        WebInspector.BaseStorageTreeElement.prototype.onselect.call(this);
    762848        this._storagePanel._showResourceView(this._resource);
    763849    },
     
    870956
    871957WebInspector.DatabaseTreeElement.prototype = {
     958    get itemURL()
     959    {
     960        return "database://" + encodeURI(this._database.name);
     961    },
     962
    872963    onselect: function()
    873964    {
     965        WebInspector.BaseStorageTreeElement.prototype.onselect.call(this);
    874966        this._storagePanel.showDatabase(this._database);
    875967    },
     
    906998
    907999WebInspector.DatabaseTableTreeElement.prototype = {
     1000    get itemURL()
     1001    {
     1002        return "database://" + encodeURI(this._database.name) + "/" + encodeURI(this._tableName);
     1003    },
     1004
    9081005    onselect: function()
    9091006    {
     1007        WebInspector.BaseStorageTreeElement.prototype.onselect.call(this);
    9101008        this._storagePanel.showDatabase(this._database, this._tableName);
    9111009    }
     
    9201018
    9211019WebInspector.DOMStorageTreeElement.prototype = {
     1020    get itemURL()
     1021    {
     1022        return "storage://" + this._domStorage.domain + "/" + (this._domStorage.isLocalStorage ? "local" : "session");
     1023    },
     1024
    9221025    onselect: function()
    9231026    {
     1027        WebInspector.BaseStorageTreeElement.prototype.onselect.call(this);
    9241028        this._storagePanel.showDOMStorage(this._domStorage);
    9251029    }
     
    9341038
    9351039WebInspector.CookieTreeElement.prototype = {
     1040    get itemURL()
     1041    {
     1042        return "cookies://" + this._cookieDomain;
     1043    },
     1044
    9361045    onselect: function()
    9371046    {
     1047        WebInspector.BaseStorageTreeElement.prototype.onselect.call(this);
    9381048        this._storagePanel.showCookies(this, this._cookieDomain);
    9391049    }
     
    9481058
    9491059WebInspector.ApplicationCacheTreeElement.prototype = {
     1060    get itemURL()
     1061    {
     1062        return "appcache://" + this._appcacheDomain;
     1063    },
     1064
    9501065    onselect: function()
    9511066    {
     1067        WebInspector.BaseStorageTreeElement.prototype.onselect.call(this);
    9521068        this._storagePanel.showApplicationCache(this, this._appcacheDomain);
    9531069    }
Note: See TracChangeset for help on using the changeset viewer.