Chromium Code Reviews Chromium Code Reviews
Issue 2712043002:
[DevTools] Separate frames and resources handling (Closed)
| Index: third_party/WebKit/Source/devtools/front_end/resources/ResourcesSection.js |
| diff --git a/third_party/WebKit/Source/devtools/front_end/resources/ResourcesPanel.js b/third_party/WebKit/Source/devtools/front_end/resources/ResourcesSection.js |
| similarity index 10% |
| copy from third_party/WebKit/Source/devtools/front_end/resources/ResourcesPanel.js |
| copy to third_party/WebKit/Source/devtools/front_end/resources/ResourcesSection.js |
| index b016d49103529b8d4afe3677afc641623bda8563..1f8fc0d37b04caa9c7321185205f6857cfb2ebd8 100644 |
| --- a/third_party/WebKit/Source/devtools/front_end/resources/ResourcesPanel.js |
| +++ b/third_party/WebKit/Source/devtools/front_end/resources/ResourcesSection.js |
| @@ -1,372 +1,97 @@ |
| -/* |
| - * Copyright (C) 2007, 2008, 2010 Apple Inc. All rights reserved. |
| - * Copyright (C) 2009 Joseph Pecoraro |
| - * Copyright (C) 2013 Samsung Electronics. All rights reserved. |
| - * |
| - * Redistribution and use in source and binary forms, with or without |
| - * modification, are permitted provided that the following conditions |
| - * are met: |
| - * |
| - * 1. Redistributions of source code must retain the above copyright |
| - * notice, this list of conditions and the following disclaimer. |
| - * 2. Redistributions in binary form must reproduce the above copyright |
| - * notice, this list of conditions and the following disclaimer in the |
| - * documentation and/or other materials provided with the distribution. |
| - * 3. Neither the name of Apple Computer, Inc. ("Apple") nor the names of |
| - * its contributors may be used to endorse or promote products derived |
| - * from this software without specific prior written permission. |
| - * |
| - * THIS SOFTWARE IS PROVIDED BY APPLE AND ITS CONTRIBUTORS "AS IS" AND ANY |
| - * EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED |
| - * WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE |
| - * DISCLAIMED. IN NO EVENT SHALL APPLE OR ITS CONTRIBUTORS BE LIABLE FOR ANY |
| - * DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES |
| - * (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; |
| - * LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND |
| - * ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT |
| - * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF |
| - * THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. |
| - */ |
| -/** |
| - * @implements {SDK.TargetManager.Observer} |
| - * @unrestricted |
| - */ |
| -Resources.ResourcesPanel = class extends UI.PanelWithSidebar { |
| - constructor() { |
| - super('resources'); |
| - this.registerRequiredCSS('resources/resourcesPanel.css'); |
| - |
| - this._resourcesLastSelectedItemSetting = Common.settings.createSetting('resourcesLastSelectedItem', {}); |
| - |
| - this._sidebarTree = new UI.TreeOutlineInShadow(); |
| - this._sidebarTree.element.classList.add('resources-sidebar'); |
| - this._sidebarTree.registerRequiredCSS('resources/resourcesSidebar.css'); |
| - this._sidebarTree.element.classList.add('filter-all'); |
| - this.panelSidebarElement().appendChild(this._sidebarTree.element); |
| - |
| - this._applicationTreeElement = this._addSidebarSection(Common.UIString('Application')); |
| - this._manifestTreeElement = new Resources.AppManifestTreeElement(this); |
| - this._applicationTreeElement.appendChild(this._manifestTreeElement); |
| - this.serviceWorkersTreeElement = new Resources.ServiceWorkersTreeElement(this); |
| - this._applicationTreeElement.appendChild(this.serviceWorkersTreeElement); |
| - var clearStorageTreeElement = new Resources.ClearStorageTreeElement(this); |
| - this._applicationTreeElement.appendChild(clearStorageTreeElement); |
| - |
| - var storageTreeElement = this._addSidebarSection(Common.UIString('Storage')); |
| - this.localStorageListTreeElement = |
| - new Resources.StorageCategoryTreeElement(this, Common.UIString('Local Storage'), 'LocalStorage'); |
| - var localStorageIcon = UI.Icon.create('mediumicon-table', 'resource-tree-item'); |
| - this.localStorageListTreeElement.setLeadingIcons([localStorageIcon]); |
| - |
| - storageTreeElement.appendChild(this.localStorageListTreeElement); |
| - this.sessionStorageListTreeElement = |
| - new Resources.StorageCategoryTreeElement(this, Common.UIString('Session Storage'), 'SessionStorage'); |
| - var sessionStorageIcon = UI.Icon.create('mediumicon-table', 'resource-tree-item'); |
| - this.sessionStorageListTreeElement.setLeadingIcons([sessionStorageIcon]); |
| - |
| - storageTreeElement.appendChild(this.sessionStorageListTreeElement); |
| - this.indexedDBListTreeElement = new Resources.IndexedDBTreeElement(this); |
| - storageTreeElement.appendChild(this.indexedDBListTreeElement); |
| - this.databasesListTreeElement = |
| - new Resources.StorageCategoryTreeElement(this, Common.UIString('Web SQL'), 'Databases'); |
| - var databaseIcon = UI.Icon.create('mediumicon-database', 'resource-tree-item'); |
| - this.databasesListTreeElement.setLeadingIcons([databaseIcon]); |
| - |
| - storageTreeElement.appendChild(this.databasesListTreeElement); |
| - this.cookieListTreeElement = new Resources.StorageCategoryTreeElement(this, Common.UIString('Cookies'), 'Cookies'); |
| - var cookieIcon = UI.Icon.create('mediumicon-cookie', 'resource-tree-item'); |
| - this.cookieListTreeElement.setLeadingIcons([cookieIcon]); |
| - storageTreeElement.appendChild(this.cookieListTreeElement); |
| - |
| - var cacheTreeElement = this._addSidebarSection(Common.UIString('Cache')); |
| - this.cacheStorageListTreeElement = new Resources.ServiceWorkerCacheTreeElement(this); |
| - cacheTreeElement.appendChild(this.cacheStorageListTreeElement); |
| - this.applicationCacheListTreeElement = |
| - new Resources.StorageCategoryTreeElement(this, Common.UIString('Application Cache'), 'ApplicationCache'); |
| - var applicationCacheIcon = UI.Icon.create('mediumicon-table', 'resource-tree-item'); |
| - this.applicationCacheListTreeElement.setLeadingIcons([applicationCacheIcon]); |
| - |
| - cacheTreeElement.appendChild(this.applicationCacheListTreeElement); |
| - |
| - this.resourcesListTreeElement = this._addSidebarSection(Common.UIString('Frames')); |
| - |
| - var mainContainer = new UI.VBox(); |
| - this.storageViews = mainContainer.element.createChild('div', 'vbox flex-auto'); |
| - this._storageViewToolbar = new UI.Toolbar('resources-toolbar', mainContainer.element); |
| - this.splitWidget().setMainWidget(mainContainer); |
| - |
| - /** @type {!Map.<!Resources.Database, !Object.<string, !Resources.DatabaseTableView>>} */ |
| - this._databaseTableViews = new Map(); |
| - /** @type {!Map.<!Resources.Database, !Resources.DatabaseQueryView>} */ |
| - this._databaseQueryViews = new Map(); |
| - /** @type {!Map.<!Resources.Database, !Resources.DatabaseTreeElement>} */ |
| - this._databaseTreeElements = new Map(); |
| - /** @type {!Map.<!Resources.DOMStorage, !Resources.DOMStorageTreeElement>} */ |
| - this._domStorageTreeElements = new Map(); |
| - /** @type {!Object.<string, boolean>} */ |
| - this._domains = {}; |
| - |
| - /** @type {?Resources.DOMStorageItemsView} */ |
| - this._domStorageView = null; |
| - /** @type {?Resources.CookieItemsView} */ |
| - this._cookieView = null; |
| - |
| - this.panelSidebarElement().addEventListener('mousemove', this._onmousemove.bind(this), false); |
| - this.panelSidebarElement().addEventListener('mouseleave', this._onmouseleave.bind(this), false); |
| - |
| - SDK.targetManager.observeTargets(this); |
| - } |
| - |
| - /** |
| - * @return {!Resources.ResourcesPanel} |
| - */ |
| - static _instance() { |
| - return /** @type {!Resources.ResourcesPanel} */ (self.runtime.sharedInstance(Resources.ResourcesPanel)); |
| - } |
| - |
| - /** |
| - * @param {string} title |
| - * @return {!UI.TreeElement} |
| - */ |
| - _addSidebarSection(title) { |
| - var treeElement = new UI.TreeElement(title, true); |
| - treeElement.listItemElement.classList.add('storage-group-list-item'); |
| - treeElement.setCollapsible(false); |
| - treeElement.selectable = false; |
| - this._sidebarTree.appendChild(treeElement); |
| - return treeElement; |
| - } |
| - |
| - /** |
| - * @override |
| - * @param {!SDK.Target} target |
| - */ |
| - targetAdded(target) { |
| - if (this._target) |
| - return; |
| - this._target = target; |
| - this._databaseModel = Resources.DatabaseModel.fromTarget(target); |
| - |
| - this._databaseModel.on(Resources.DatabaseModel.DatabaseAddedEvent, this._databaseAdded, this); |
| - this._databaseModel.on(Resources.DatabaseModel.DatabasesRemovedEvent, this._resetWebSQL, this); |
| - |
| - var resourceTreeModel = SDK.ResourceTreeModel.fromTarget(target); |
| - if (!resourceTreeModel) |
| - return; |
| - |
| - if (resourceTreeModel.cachedResourcesLoaded()) |
| - this._initialize(); |
| - |
| - resourceTreeModel.addEventListener(SDK.ResourceTreeModel.Events.CachedResourcesLoaded, this._initialize, this); |
| - resourceTreeModel.addEventListener( |
| - SDK.ResourceTreeModel.Events.WillLoadCachedResources, this._resetWithFrames, this); |
| - } |
| +// Copyright 2017 The Chromium Authors. All rights reserved. |
| +// Use of this source code is governed by a BSD-style license that can be |
| +// found in the LICENSE file. |
| +Resources.ResourcesSection = class { |
| /** |
| - * @override |
| - * @param {!SDK.Target} target |
| + * @param {!Resources.ResourcesPanel} storagePanel |
| + * @param {!UI.TreeElement} treeElement |
| */ |
| - targetRemoved(target) { |
| - if (target !== this._target) |
| - return; |
| - delete this._target; |
| + constructor(storagePanel, treeElement) { |
| + this._panel = storagePanel; |
| + this._treeElement = treeElement; |
| + /** @type {!Map<string, !Resources.FrameTreeElement>} */ |
| + this._treeElementForFrameId = new Map(); |
| - var resourceTreeModel = SDK.ResourceTreeModel.fromTarget(target); |
| - if (resourceTreeModel) { |
| - resourceTreeModel.removeEventListener(SDK.ResourceTreeModel.Events.CachedResourcesLoaded, this._initialize, this); |
| - resourceTreeModel.removeEventListener( |
| - SDK.ResourceTreeModel.Events.WillLoadCachedResources, this._resetWithFrames, this); |
| + function addListener(eventType, handler, target) { |
| + SDK.targetManager.addModelListener(SDK.ResourceTreeModel, eventType, event => handler.call(target, event.data)); |
| } |
| - this._databaseModel.off(Resources.DatabaseModel.DatabaseAddedEvent, this._databaseAdded, this); |
| - this._databaseModel.off(Resources.DatabaseModel.DatabasesRemovedEvent, this._resetWebSQL, this); |
| + addListener(SDK.ResourceTreeModel.Events.FrameAdded, this._frameAdded, this); |
| + addListener(SDK.ResourceTreeModel.Events.FrameNavigated, this._frameNavigated, this); |
| + addListener(SDK.ResourceTreeModel.Events.FrameDetached, this._frameDetached, this); |
| + addListener(SDK.ResourceTreeModel.Events.ResourceAdded, this._resourceAdded, this); |
| - this._resetWithFrames(); |
| + var mainTarget = SDK.targetManager.mainTarget(); |
| + var resourceTreeModel = mainTarget && mainTarget.hasDOMCapability() && SDK.ResourceTreeModel.fromTarget(mainTarget); |
| + var mainFrame = resourceTreeModel && resourceTreeModel.mainFrame; |
| + if (mainFrame) |
| + this.populateFrame(mainFrame); |
| } |
| /** |
| - * @override |
| + * @param {!SDK.ResourceTreeFrame} frame |
| + * @returns {?SDK.ResourceTreeFrame} |
| */ |
| - focus() { |
| - this._sidebarTree.focus(); |
| - } |
| - |
| - _initialize() { |
| - this._databaseModel.enable(); |
| - |
| - var indexedDBModel = Resources.IndexedDBModel.fromTarget(this._target); |
| - if (indexedDBModel) |
| - indexedDBModel.enable(); |
| - |
| - var cacheStorageModel = SDK.ServiceWorkerCacheModel.fromTarget(this._target); |
| - if (cacheStorageModel) |
| - cacheStorageModel.enable(); |
| - var resourceTreeModel = SDK.ResourceTreeModel.fromTarget(this._target); |
| - if (resourceTreeModel) { |
| - this._populateResourceTree(resourceTreeModel); |
| - this._populateApplicationCacheTree(resourceTreeModel); |
| - } |
| - var domStorageModel = Resources.DOMStorageModel.fromTarget(this._target); |
| - if (domStorageModel) |
| - this._populateDOMStorageTree(domStorageModel); |
| - this.indexedDBListTreeElement._initialize(); |
| - this.cacheStorageListTreeElement._initialize(); |
| - this._initDefaultSelection(); |
| - } |
| - |
| - _initDefaultSelection() { |
| - var itemURL = this._resourcesLastSelectedItemSetting.get(); |
| - if (itemURL) { |
| - var rootElement = this._sidebarTree.rootElement(); |
| - for (var treeElement = rootElement.firstChild(); treeElement; |
| - treeElement = treeElement.traverseNextTreeElement(false, rootElement, true)) { |
| - if (treeElement.itemURL === itemURL) { |
| - treeElement.revealAndSelect(true); |
| - return; |
| - } |
| - } |
| - } |
| - this._manifestTreeElement.select(); |
| - } |
| - |
| - _resetWithFrames() { |
| - this.resourcesListTreeElement.removeChildren(); |
| - this._treeElementForFrameId = {}; |
| - this._reset(); |
| - } |
| - |
| - _resetWebSQL() { |
| - if (this.visibleView instanceof Resources.DatabaseQueryView || |
| - this.visibleView instanceof Resources.DatabaseTableView) { |
| - this.visibleView.detach(); |
| - delete this.visibleView; |
| - } |
| - |
| - var queryViews = this._databaseQueryViews.valuesArray(); |
| - for (var i = 0; i < queryViews.length; ++i) { |
| - queryViews[i].removeEventListener( |
| - Resources.DatabaseQueryView.Events.SchemaUpdated, this._updateDatabaseTables, this); |
| - } |
| - this._databaseTableViews.clear(); |
| - this._databaseQueryViews.clear(); |
| - this._databaseTreeElements.clear(); |
| - this.databasesListTreeElement.removeChildren(); |
| - this.databasesListTreeElement.setExpandable(false); |
| - } |
| - |
| - _resetDOMStorage() { |
| - if (this.visibleView === this._domStorageView) { |
| - this.visibleView.detach(); |
| - delete this.visibleView; |
| - } |
| - |
| - this._domStorageTreeElements.clear(); |
| - this.localStorageListTreeElement.removeChildren(); |
| - this.sessionStorageListTreeElement.removeChildren(); |
| - } |
| - |
| - _resetCookies() { |
| - if (this.visibleView instanceof Resources.CookieItemsView) { |
| - this.visibleView.detach(); |
| - delete this.visibleView; |
| - } |
| - this.cookieListTreeElement.removeChildren(); |
| - } |
| - |
| - _resetCacheStorage() { |
| - if (this.visibleView instanceof Resources.ServiceWorkerCacheView) { |
| - this.visibleView.detach(); |
| - delete this.visibleView; |
| - } |
| - this.cacheStorageListTreeElement.removeChildren(); |
| - this.cacheStorageListTreeElement.setExpandable(false); |
| - } |
| - |
| - _resetAppCache() { |
| - for (var frameId of Object.keys(this._applicationCacheFrameElements)) |
| - this._applicationCacheFrameManifestRemoved({data: frameId}); |
| - this.applicationCacheListTreeElement.setExpandable(false); |
| - } |
| - |
| - _reset() { |
| - this._domains = {}; |
| - this._resetWebSQL(); |
| - this._resetDOMStorage(); |
| - this._resetCookies(); |
| - this._resetCacheStorage(); |
| - // No need to this._resetAppCache. |
| - |
| - if ((this.visibleView instanceof SourceFrame.ResourceSourceFrame) || |
| - (this.visibleView instanceof SourceFrame.ImageView) || (this.visibleView instanceof SourceFrame.FontView)) { |
| - this.visibleView.detach(); |
| - delete this.visibleView; |
| - } |
| - |
| - this._storageViewToolbar.removeToolbarItems(); |
| - |
| - if (this._sidebarTree.selectedTreeElement) |
| - this._sidebarTree.selectedTreeElement.deselect(); |
| + static _getParentFrame(frame) { |
| + var parentFrame = frame.parentFrame; |
| + if (parentFrame) |
| + return parentFrame; |
| + var parentTarget = frame.target().parentTarget(); |
| + if (!parentTarget) |
| + return null; |
| + console.assert(parentTarget.hasDOMCapability()); |
| + return SDK.ResourceTreeModel.fromTarget(parentTarget).mainFrame; |
| } |
| /** |
| - * @param {!SDK.ResourceTreeModel} resourceTreeModel |
| + * @param {!SDK.ResourceTreeFrame} frame |
| */ |
| - _populateResourceTree(resourceTreeModel) { |
| - this._treeElementForFrameId = {}; |
| - resourceTreeModel.addEventListener(SDK.ResourceTreeModel.Events.FrameAdded, this._frameAdded, this); |
| - resourceTreeModel.addEventListener(SDK.ResourceTreeModel.Events.FrameNavigated, this._frameNavigated, this); |
| - resourceTreeModel.addEventListener(SDK.ResourceTreeModel.Events.FrameDetached, this._frameDetached, this); |
| - resourceTreeModel.addEventListener(SDK.ResourceTreeModel.Events.ResourceAdded, this._resourceAdded, this); |
| - |
| - /** |
| - * @param {!SDK.ResourceTreeFrame} frame |
| - * @this {Resources.ResourcesPanel} |
| - */ |
| - function populateFrame(frame) { |
| - this._frameAdded({data: frame}); |
| - for (var i = 0; i < frame.childFrames.length; ++i) |
| - populateFrame.call(this, frame.childFrames[i]); |
| - |
| - var resources = frame.resources(); |
| - for (var i = 0; i < resources.length; ++i) |
| - this._resourceAdded({data: resources[i]}); |
| - } |
| - populateFrame.call(this, resourceTreeModel.mainFrame); |
| - } |
| - |
| - _frameAdded(event) { |
| - var frame = event.data; |
| - var parentFrame = frame.parentFrame; |
| - |
| - var parentTreeElement = parentFrame ? this._treeElementForFrameId[parentFrame.id] : this.resourcesListTreeElement; |
| + _frameAdded(frame) { |
| + var parentFrame = Resources.ResourcesSection._getParentFrame(frame); |
| + var parentTreeElement = parentFrame ? this._treeElementForFrameId.get(parentFrame.id) : this._treeElement; |
| if (!parentTreeElement) { |
| - console.warn('No frame to route ' + frame.url + ' to.'); |
| + console.warn(`No frame to route ${frame.url} to.`); |
| return; |
| } |
| - var frameTreeElement = new Resources.FrameTreeElement(this, frame); |
| - this._treeElementForFrameId[frame.id] = frameTreeElement; |
| + var frameTreeElement = new Resources.FrameTreeElement(this._panel, frame); |
| + this._treeElementForFrameId.set(frame.id, frameTreeElement); |
| parentTreeElement.appendChild(frameTreeElement); |
| } |
| - _frameDetached(event) { |
| - var frame = event.data; |
| - var frameTreeElement = this._treeElementForFrameId[frame.id]; |
| + /** |
| + * @param {!SDK.ResourceTreeFrame} frame |
| + */ |
| + _frameDetached(frame) { |
| + var frameTreeElement = this._treeElementForFrameId.get(frame.id); |
| if (!frameTreeElement) |
| return; |
| - delete this._treeElementForFrameId[frame.id]; |
| + this._treeElementForFrameId.remove(frame.id); |
| if (frameTreeElement.parent) |
| frameTreeElement.parent.removeChild(frameTreeElement); |
| } |
| - _resourceAdded(event) { |
| - var resource = event.data; |
| - var frameId = resource.frameId; |
| + /** |
| + * @param {!SDK.ResourceTreeFrame} frame |
| + */ |
| + _frameNavigated(frame) { |
| + if (!Resources.ResourcesSection._getParentFrame(frame)) |
| + return; |
| + var frameTreeElement = this._treeElementForFrameId.get(frame.id); |
| + if (frameTreeElement) |
| + frameTreeElement.frameNavigated(frame); |
| + } |
| - if (resource.statusCode >= 301 && resource.statusCode <= 303) |
| + /** |
| + * @param {!SDK.Resource} resource |
| + */ |
| + _resourceAdded(resource) { |
| + var statusCode = resource['statusCode']; |
| + if (statusCode >= 301 && statusCode <= 303) |
| return; |
| - var frameTreeElement = this._treeElementForFrameId[frameId]; |
| + var frameTreeElement = this._treeElementForFrameId.get(resource.frameId); |
| if (!frameTreeElement) { |
| // This is a frame's main resource, it will be retained |
| // and re-added by the resource manager; |
| @@ -376,150 +101,185 @@ Resources.ResourcesPanel = class extends UI.PanelWithSidebar { |
| frameTreeElement.appendResource(resource); |
| } |
| - _frameNavigated(event) { |
| - var frame = event.data; |
| - |
| - if (!frame.parentFrame) |
| - this._reset(); |
| - |
| - var frameId = frame.id; |
| - var frameTreeElement = this._treeElementForFrameId[frameId]; |
| - if (frameTreeElement) |
| - frameTreeElement.frameNavigated(frame); |
| - |
| - var applicationCacheFrameTreeElement = this._applicationCacheFrameElements[frameId]; |
| - if (applicationCacheFrameTreeElement) |
| - applicationCacheFrameTreeElement.frameNavigated(frame); |
| + reset() { |
| + this._treeElement.removeChildren(); |
| + this._treeElementForFrameId.clear(); |
| } |
| /** |
| - * @param {!Resources.DatabaseModel.DatabaseAddedEvent} event |
| + * @param {!SDK.ResourceTreeFrame} frame |
| */ |
| - _databaseAdded(event) { |
| - var databaseTreeElement = new Resources.DatabaseTreeElement(this, event.database); |
| - this._databaseTreeElements.set(event.database, databaseTreeElement); |
| - this.databasesListTreeElement.appendChild(databaseTreeElement); |
| + populateFrame(frame) { |
|
caseq
2017/03/04 01:46:06
_populateFrame(frame)?
eostroukhov
2017/03/04 02:11:40
Done.
|
| + this._frameAdded(frame); |
| + for (var child of frame.childFrames) |
| + this.populateFrame(child); |
| + for (var resource of frame.resources()) |
| + this._resourceAdded(resource); |
| } |
| +}; |
| +Resources.FrameTreeElement = class extends Resources.BaseStorageTreeElement { |
| /** |
| + * @param {!Resources.ResourcesPanel} storagePanel |
| * @param {!SDK.ResourceTreeFrame} frame |
| */ |
| - addCookieDocument(frame) { |
| - var parsedURL = frame.url.asParsedURL(); |
| - if (!parsedURL || (parsedURL.scheme !== 'http' && parsedURL.scheme !== 'https' && parsedURL.scheme !== 'file')) |
| - return; |
| + constructor(storagePanel, frame) { |
| + super(storagePanel, '', false); |
| + this._panel = storagePanel; |
| + this._frame = frame; |
| + this._frameId = frame.id; |
| + this._categoryElements = {}; |
| + this._treeElementForResource = {}; |
| + this.frameNavigated(frame); |
| - var domain = parsedURL.securityOrigin(); |
| - if (!this._domains[domain]) { |
| - this._domains[domain] = true; |
| - var cookieDomainTreeElement = new Resources.CookieTreeElement(this, frame, domain); |
| - this.cookieListTreeElement.appendChild(cookieDomainTreeElement); |
| - } |
| + var icon = UI.Icon.create('largeicon-navigator-frame', 'navigator-tree-item'); |
| + icon.classList.add('navigator-frame-tree-item'); |
| + this.setLeadingIcons([icon]); |
| } |
| - /** |
| - * @param {!Common.Event} event |
| - */ |
| - _domStorageAdded(event) { |
| - var domStorage = /** @type {!Resources.DOMStorage} */ (event.data); |
| - this._addDOMStorage(domStorage); |
| + frameNavigated(frame) { |
| + this.removeChildren(); |
| + this._frameId = frame.id; |
| + this.title = frame.displayName(); |
| + this._categoryElements = {}; |
| + this._treeElementForResource = {}; |
| + } |
| + |
| + get itemURL() { |
| + return 'frame://' + encodeURI(this.titleAsText()); |
| } |
| /** |
| - * @param {!Resources.DOMStorage} domStorage |
| + * @override |
| + * @return {boolean} |
| */ |
| - _addDOMStorage(domStorage) { |
| - console.assert(!this._domStorageTreeElements.get(domStorage)); |
| + onselect(selectedByUser) { |
| + super.onselect(selectedByUser); |
| + this._panel.showCategoryView(this.titleAsText()); |
| - var domStorageTreeElement = new Resources.DOMStorageTreeElement(this, domStorage); |
| - this._domStorageTreeElements.set(domStorage, domStorageTreeElement); |
| - if (domStorage.isLocalStorage) |
| - this.localStorageListTreeElement.appendChild(domStorageTreeElement); |
| - else |
| - this.sessionStorageListTreeElement.appendChild(domStorageTreeElement); |
| + this.listItemElement.classList.remove('hovered'); |
| + SDK.DOMModel.hideDOMNodeHighlight(); |
| + return false; |
| } |
| - /** |
| - * @param {!Common.Event} event |
| - */ |
| - _domStorageRemoved(event) { |
| - var domStorage = /** @type {!Resources.DOMStorage} */ (event.data); |
| - this._removeDOMStorage(domStorage); |
| + set hovered(hovered) { |
| + if (hovered) { |
| + this.listItemElement.classList.add('hovered'); |
| + var domModel = SDK.DOMModel.fromTarget(this._frame.target()); |
| + if (domModel) |
| + domModel.highlightFrame(this._frameId); |
| + } else { |
| + this.listItemElement.classList.remove('hovered'); |
| + SDK.DOMModel.hideDOMNodeHighlight(); |
| + } |
| } |
| /** |
| - * @param {!Resources.DOMStorage} domStorage |
| + * @param {!SDK.Resource} resource |
| */ |
| - _removeDOMStorage(domStorage) { |
| - var treeElement = this._domStorageTreeElements.get(domStorage); |
| - if (!treeElement) |
| - return; |
| - var wasSelected = treeElement.selected; |
| - var parentListTreeElement = treeElement.parent; |
| - parentListTreeElement.removeChild(treeElement); |
| - if (wasSelected) |
| - parentListTreeElement.select(); |
| - this._domStorageTreeElements.remove(domStorage); |
| + appendResource(resource) { |
| + var resourceType = resource.resourceType(); |
| + var categoryName = resourceType.name(); |
| + var categoryElement = resourceType === Common.resourceTypes.Document ? this : this._categoryElements[categoryName]; |
| + if (!categoryElement) { |
| + categoryElement = |
| + new Resources.StorageCategoryTreeElement(this._panel, resource.resourceType().category().title, categoryName); |
| + this._categoryElements[resourceType.name()] = categoryElement; |
| + this._insertInPresentationOrder(this, categoryElement); |
| + } |
| + var resourceTreeElement = new Resources.FrameResourceTreeElement(this._panel, resource); |
| + this._insertInPresentationOrder(categoryElement, resourceTreeElement); |
| + this._treeElementForResource[resource.url] = resourceTreeElement; |
| } |
| /** |
| - * @param {!Resources.Database} database |
| + * @param {string} url |
| + * @return {?SDK.Resource} |
| */ |
| - selectDatabase(database) { |
| - if (database) { |
| - this._showDatabase(database); |
| - this._databaseTreeElements.get(database).select(); |
| - } |
| + resourceByURL(url) { |
| + var treeElement = this._treeElementForResource[url]; |
| + return treeElement ? treeElement._resource : null; |
| } |
| /** |
| - * @param {!Resources.DOMStorage} domStorage |
| + * @override |
| */ |
| - selectDOMStorage(domStorage) { |
| - if (domStorage) { |
| - this._showDOMStorage(domStorage); |
| - this._domStorageTreeElements.get(domStorage).select(); |
| + appendChild(treeElement) { |
| + this._insertInPresentationOrder(this, treeElement); |
| + } |
| + |
| + _insertInPresentationOrder(parentTreeElement, childTreeElement) { |
| + // Insert in the alphabetical order, first frames, then resources. Document resource goes last. |
| + function typeWeight(treeElement) { |
| + if (treeElement instanceof Resources.StorageCategoryTreeElement) |
| + return 2; |
| + if (treeElement instanceof Resources.FrameTreeElement) |
| + return 1; |
| + return 3; |
| + } |
| + |
| + function compare(treeElement1, treeElement2) { |
| + var typeWeight1 = typeWeight(treeElement1); |
| + var typeWeight2 = typeWeight(treeElement2); |
| + |
| + var result; |
| + if (typeWeight1 > typeWeight2) |
| + result = 1; |
| + else if (typeWeight1 < typeWeight2) |
| + result = -1; |
| + else |
| + result = treeElement1.titleAsText().localeCompare(treeElement2.titleAsText()); |
| + return result; |
| } |
| + |
| + var childCount = parentTreeElement.childCount(); |
| + var i; |
| + for (i = 0; i < childCount; ++i) { |
| + if (compare(childTreeElement, parentTreeElement.childAt(i)) < 0) |
| + break; |
| + } |
| + parentTreeElement.insertChild(childTreeElement, i); |
| } |
| +}; |
| +Resources.FrameResourceTreeElement = class extends Resources.BaseStorageTreeElement { |
| /** |
| + * @param {!Resources.ResourcesPanel} storagePanel |
| * @param {!SDK.Resource} resource |
| - * @param {number=} line |
| - * @param {number=} column |
| - * @return {boolean} |
| */ |
| - showResource(resource, line, column) { |
| - var resourceTreeElement = this._findTreeElementForResource(resource); |
| - if (resourceTreeElement) |
| - resourceTreeElement.revealAndSelect(true); |
| + constructor(storagePanel, resource) { |
| + super(storagePanel, resource.displayName, false); |
| + this._panel = storagePanel; |
| + /** @type {!SDK.Resource} */ |
| + this._resource = resource; |
| + /** @type {?SourceFrame.ResourceSourceFrame} */ |
| + this._sourceFrame = null; |
| + this.tooltip = resource.url; |
| + this._resource[Resources.FrameResourceTreeElement._symbol] = this; |
| - if (typeof line === 'number') { |
| - var resourceSourceFrame = this._resourceSourceFrameViewForResource(resource); |
| - if (resourceSourceFrame) |
| - resourceSourceFrame.revealPosition(line, column, true); |
| - } |
| - return true; |
| + var icon = UI.Icon.create('largeicon-navigator-file', 'navigator-tree-item'); |
| + icon.classList.add('navigator-file-tree-item'); |
| + icon.classList.add('navigator-' + resource.resourceType().name() + '-tree-item'); |
| + this.setLeadingIcons([icon]); |
| } |
| - _showResourceView(resource) { |
| - var view = this._resourceViewForResource(resource); |
| - if (!view) { |
| - this.visibleView.detach(); |
| - return; |
| - } |
| - this._innerShowView(view); |
| + /** |
| + * @param {!SDK.Resource} resource |
| + */ |
| + static forResource(resource) { |
| + return resource[Resources.FrameResourceTreeElement._symbol]; |
| } |
| /** |
| * @param {!SDK.Resource} resource |
| * @return {?UI.Widget} |
| */ |
| - _resourceViewForResource(resource) { |
| + static resourceViewForResource(resource) { |
|
caseq
2017/03/04 01:46:06
could remain private as well.
eostroukhov
2017/03/04 02:11:40
It is referenced from ResourcesPanel.js.
|
| if (resource.hasTextContent()) { |
| - var treeElement = this._findTreeElementForResource(resource); |
| + var treeElement = Resources.FrameResourceTreeElement.forResource(resource); |
| if (!treeElement) |
| return null; |
| - return treeElement.sourceView(); |
| + return treeElement._sourceView(); |
| } |
| switch (resource.resourceType()) { |
| @@ -532,1563 +292,65 @@ Resources.ResourcesPanel = class extends UI.PanelWithSidebar { |
| } |
| } |
| - /** |
| - * @param {!SDK.Resource} resource |
| - * @return {?SourceFrame.ResourceSourceFrame} |
| - */ |
| - _resourceSourceFrameViewForResource(resource) { |
| - var resourceView = this._resourceViewForResource(resource); |
| - if (resourceView && resourceView instanceof SourceFrame.ResourceSourceFrame) |
| - return /** @type {!SourceFrame.ResourceSourceFrame} */ (resourceView); |
| - return null; |
| + get itemURL() { |
| + return this._resource.url; |
| } |
| /** |
| - * @param {!Resources.Database} database |
| - * @param {string=} tableName |
| + * @override |
| + * @return {boolean} |
| */ |
| - _showDatabase(database, tableName) { |
| - if (!database) |
| - return; |
| - |
| - var view; |
| - if (tableName) { |
| - var tableViews = this._databaseTableViews.get(database); |
| - if (!tableViews) { |
| - tableViews = /** @type {!Object.<string, !Resources.DatabaseTableView>} */ ({}); |
| - this._databaseTableViews.set(database, tableViews); |
| - } |
| - view = tableViews[tableName]; |
| - if (!view) { |
| - view = new Resources.DatabaseTableView(database, tableName); |
| - tableViews[tableName] = view; |
| - } |
| - } else { |
| - view = this._databaseQueryViews.get(database); |
| - if (!view) { |
| - view = new Resources.DatabaseQueryView(database); |
| - this._databaseQueryViews.set(database, view); |
| - view.addEventListener(Resources.DatabaseQueryView.Events.SchemaUpdated, this._updateDatabaseTables, this); |
| - } |
| - } |
| - |
| - this._innerShowView(view); |
| + onselect(selectedByUser) { |
| + super.onselect(selectedByUser); |
| + this.showView(Resources.FrameResourceTreeElement.resourceViewForResource(this._resource)); |
| + return false; |
| } |
| /** |
| - * @param {!Resources.DOMStorage} domStorage |
| + * @override |
| + * @return {boolean} |
| */ |
| - _showDOMStorage(domStorage) { |
| - if (!domStorage) |
| - return; |
| - |
| - if (!this._domStorageView) |
| - this._domStorageView = new Resources.DOMStorageItemsView(domStorage); |
| - else |
| - this._domStorageView.setStorage(domStorage); |
| - this._innerShowView(this._domStorageView); |
| + ondblclick(event) { |
| + InspectorFrontendHost.openInNewTab(this._resource.url); |
| + return false; |
| } |
| /** |
| - * @param {!Resources.CookieTreeElement} treeElement |
| - * @param {string} cookieDomain |
| - * @param {!SDK.Target} cookieFrameTarget |
| + * @override |
| */ |
| - showCookies(treeElement, cookieDomain, cookieFrameTarget) { |
| - var model = SDK.CookieModel.fromTarget(cookieFrameTarget); |
| - if (!this._cookieView) |
| - this._cookieView = new Resources.CookieItemsView(treeElement, model, cookieDomain); |
| - else |
| - this._cookieView.setCookiesDomain(model, cookieDomain); |
| - this._innerShowView(this._cookieView); |
| + onattach() { |
| + super.onattach(); |
| + this.listItemElement.draggable = true; |
| + this.listItemElement.addEventListener('dragstart', this._ondragstart.bind(this), false); |
| + this.listItemElement.addEventListener('contextmenu', this._handleContextMenuEvent.bind(this), true); |
| } |
| /** |
| - * @param {!SDK.Target} target |
| - * @param {string} cookieDomain |
| + * @param {!MouseEvent} event |
| + * @return {boolean} |
| */ |
| - _clearCookies(target, cookieDomain) { |
| - SDK.CookieModel.fromTarget(target).clear(cookieDomain, () => { |
| - if (this._cookieView) |
| - this._cookieView.refreshItems(); |
| - }); |
| - } |
| - |
| - showApplicationCache(frameId) { |
| - if (!this._applicationCacheViews[frameId]) { |
| - this._applicationCacheViews[frameId] = |
| - new Resources.ApplicationCacheItemsView(this._applicationCacheModel, frameId); |
| - } |
| - |
| - this._innerShowView(this._applicationCacheViews[frameId]); |
| - } |
| - |
| - /** |
| - * @param {!UI.Widget} view |
| - */ |
| - showFileSystem(view) { |
| - this._innerShowView(view); |
| - } |
| - |
| - showCategoryView(categoryName) { |
| - if (!this._categoryView) |
| - this._categoryView = new Resources.StorageCategoryView(); |
| - this._categoryView.setText(categoryName); |
| - this._innerShowView(this._categoryView); |
| - } |
| - |
| - _innerShowView(view) { |
| - if (this.visibleView === view) |
| - return; |
| - |
| - if (this.visibleView) |
| - this.visibleView.detach(); |
| - |
| - view.show(this.storageViews); |
| - this.visibleView = view; |
| - |
| - this._storageViewToolbar.removeToolbarItems(); |
| - var toolbarItems = (view instanceof UI.SimpleView && view.syncToolbarItems()) || []; |
| - for (var i = 0; i < toolbarItems.length; ++i) |
| - this._storageViewToolbar.appendToolbarItem(toolbarItems[i]); |
| - this._storageViewToolbar.element.classList.toggle('hidden', !toolbarItems.length); |
| - } |
| - |
| - closeVisibleView() { |
| - if (!this.visibleView) |
| - return; |
| - this.visibleView.detach(); |
| - delete this.visibleView; |
| - } |
| - |
| - _updateDatabaseTables(event) { |
| - var database = event.data; |
| - |
| - if (!database) |
| - return; |
| - |
| - var databasesTreeElement = this._databaseTreeElements.get(database); |
| - if (!databasesTreeElement) |
| - return; |
| - |
| - databasesTreeElement.invalidateChildren(); |
| - var tableViews = this._databaseTableViews.get(database); |
| - |
| - if (!tableViews) |
| - return; |
| - |
| - var tableNamesHash = {}; |
| - var self = this; |
| - function tableNamesCallback(tableNames) { |
| - var tableNamesLength = tableNames.length; |
| - for (var i = 0; i < tableNamesLength; ++i) |
| - tableNamesHash[tableNames[i]] = true; |
| - |
| - for (var tableName in tableViews) { |
| - if (!(tableName in tableNamesHash)) { |
| - if (self.visibleView === tableViews[tableName]) |
| - self.closeVisibleView(); |
| - delete tableViews[tableName]; |
| - } |
| - } |
| - } |
| - database.getTableNames(tableNamesCallback); |
| - } |
| - |
| - /** |
| - * @param {!Resources.DOMStorageModel} domStorageModel |
| - */ |
| - _populateDOMStorageTree(domStorageModel) { |
| - domStorageModel.enable(); |
| - domStorageModel.storages().forEach(this._addDOMStorage.bind(this)); |
| - domStorageModel.addEventListener(Resources.DOMStorageModel.Events.DOMStorageAdded, this._domStorageAdded, this); |
| - domStorageModel.addEventListener(Resources.DOMStorageModel.Events.DOMStorageRemoved, this._domStorageRemoved, this); |
| - } |
| - |
| - /** |
| - * @param {!SDK.ResourceTreeModel} resourceTreeModel |
| - */ |
| - _populateApplicationCacheTree(resourceTreeModel) { |
| - this._applicationCacheModel = Resources.ApplicationCacheModel.fromTarget(this._target); |
| - |
| - this._applicationCacheViews = {}; |
| - this._applicationCacheFrameElements = {}; |
| - this._applicationCacheManifestElements = {}; |
| - |
| - this._applicationCacheModel.addEventListener( |
| - Resources.ApplicationCacheModel.Events.FrameManifestAdded, this._applicationCacheFrameManifestAdded, this); |
| - this._applicationCacheModel.addEventListener( |
| - Resources.ApplicationCacheModel.Events.FrameManifestRemoved, this._applicationCacheFrameManifestRemoved, this); |
| - this._applicationCacheModel.addEventListener( |
| - Resources.ApplicationCacheModel.Events.FrameManifestsReset, this._resetAppCache, this); |
| - |
| - this._applicationCacheModel.addEventListener( |
| - Resources.ApplicationCacheModel.Events.FrameManifestStatusUpdated, |
| - this._applicationCacheFrameManifestStatusChanged, this); |
| - this._applicationCacheModel.addEventListener( |
| - Resources.ApplicationCacheModel.Events.NetworkStateChanged, this._applicationCacheNetworkStateChanged, this); |
| - } |
| - |
| - _applicationCacheFrameManifestAdded(event) { |
| - var frameId = event.data; |
| - var manifestURL = this._applicationCacheModel.frameManifestURL(frameId); |
| - |
| - var manifestTreeElement = this._applicationCacheManifestElements[manifestURL]; |
| - if (!manifestTreeElement) { |
| - manifestTreeElement = new Resources.ApplicationCacheManifestTreeElement(this, manifestURL); |
| - this.applicationCacheListTreeElement.appendChild(manifestTreeElement); |
| - this._applicationCacheManifestElements[manifestURL] = manifestTreeElement; |
| - } |
| - |
| - var frameTreeElement = new Resources.ApplicationCacheFrameTreeElement(this, frameId, manifestURL); |
| - manifestTreeElement.appendChild(frameTreeElement); |
| - manifestTreeElement.expand(); |
| - this._applicationCacheFrameElements[frameId] = frameTreeElement; |
| - } |
| - |
| - _applicationCacheFrameManifestRemoved(event) { |
| - var frameId = event.data; |
| - var frameTreeElement = this._applicationCacheFrameElements[frameId]; |
| - if (!frameTreeElement) |
| - return; |
| - |
| - var manifestURL = frameTreeElement.manifestURL; |
| - delete this._applicationCacheFrameElements[frameId]; |
| - delete this._applicationCacheViews[frameId]; |
| - frameTreeElement.parent.removeChild(frameTreeElement); |
| - |
| - var manifestTreeElement = this._applicationCacheManifestElements[manifestURL]; |
| - if (manifestTreeElement.childCount()) |
| - return; |
| - |
| - delete this._applicationCacheManifestElements[manifestURL]; |
| - manifestTreeElement.parent.removeChild(manifestTreeElement); |
| - } |
| - |
| - _applicationCacheFrameManifestStatusChanged(event) { |
| - var frameId = event.data; |
| - var status = this._applicationCacheModel.frameManifestStatus(frameId); |
| - |
| - if (this._applicationCacheViews[frameId]) |
| - this._applicationCacheViews[frameId].updateStatus(status); |
| - } |
| - |
| - _applicationCacheNetworkStateChanged(event) { |
| - var isNowOnline = event.data; |
| - |
| - for (var manifestURL in this._applicationCacheViews) |
| - this._applicationCacheViews[manifestURL].updateNetworkState(isNowOnline); |
| - } |
| - |
| - _findTreeElementForResource(resource) { |
| - return resource[Resources.FrameResourceTreeElement._symbol]; |
| - } |
| - |
| - showView(view) { |
| - if (view) |
| - this.showResource(view.resource); |
| - } |
| - |
| - _onmousemove(event) { |
| - var nodeUnderMouse = event.target; |
| - if (!nodeUnderMouse) |
| - return; |
| - |
| - var listNode = nodeUnderMouse.enclosingNodeOrSelfWithNodeName('li'); |
| - if (!listNode) |
| - return; |
| - |
| - var element = listNode.treeElement; |
| - if (this._previousHoveredElement === element) |
| - return; |
| - |
| - if (this._previousHoveredElement) { |
| - this._previousHoveredElement.hovered = false; |
| - delete this._previousHoveredElement; |
| - } |
| - |
| - if (element instanceof Resources.FrameTreeElement) { |
| - this._previousHoveredElement = element; |
| - element.hovered = true; |
| - } |
| - } |
| - |
| - _onmouseleave(event) { |
| - if (this._previousHoveredElement) { |
| - this._previousHoveredElement.hovered = false; |
| - delete this._previousHoveredElement; |
| - } |
| - } |
| -}; |
| - |
| -/** |
| - * @implements {Common.Revealer} |
| - * @unrestricted |
| - */ |
| -Resources.ResourcesPanel.ResourceRevealer = class { |
| - /** |
| - * @override |
| - * @param {!Object} resource |
| - * @return {!Promise} |
| - */ |
| - reveal(resource) { |
| - if (!(resource instanceof SDK.Resource)) |
| - return Promise.reject(new Error('Internal error: not a resource')); |
| - var panel = Resources.ResourcesPanel._instance(); |
| - return UI.viewManager.showView('resources').then(panel.showResource.bind(panel, resource)); |
| - } |
| -}; |
| - |
| -/** |
| - * @unrestricted |
| - */ |
| -Resources.BaseStorageTreeElement = class extends UI.TreeElement { |
| - /** |
| - * @param {!Resources.ResourcesPanel} storagePanel |
| - * @param {string} title |
| - * @param {boolean} expandable |
| - */ |
| - constructor(storagePanel, title, expandable) { |
| - super(title, expandable); |
| - this._storagePanel = storagePanel; |
| - } |
| - |
| - /** |
| - * @override |
| - * @return {boolean} |
| - */ |
| - onselect(selectedByUser) { |
| - if (!selectedByUser) |
| - return false; |
| - var itemURL = this.itemURL; |
| - if (itemURL) |
| - this._storagePanel._resourcesLastSelectedItemSetting.set(itemURL); |
| - return false; |
| - } |
| -}; |
| - |
| -/** |
| - * @unrestricted |
| - */ |
| -Resources.StorageCategoryTreeElement = class extends Resources.BaseStorageTreeElement { |
| - /** |
| - * @param {!Resources.ResourcesPanel} storagePanel |
| - * @param {string} categoryName |
| - * @param {string} settingsKey |
| - */ |
| - constructor(storagePanel, categoryName, settingsKey) { |
| - super(storagePanel, categoryName, false); |
| - this._expandedSetting = |
| - Common.settings.createSetting('resources' + settingsKey + 'Expanded', settingsKey === 'Frames'); |
| - this._categoryName = categoryName; |
| - } |
| - |
| - /** |
| - * @return {!SDK.Target} |
| - */ |
| - target() { |
| - return this._storagePanel._target; |
| - } |
| - |
| - get itemURL() { |
| - return 'category://' + this._categoryName; |
| - } |
| - |
| - /** |
| - * @override |
| - * @return {boolean} |
| - */ |
| - onselect(selectedByUser) { |
| - super.onselect(selectedByUser); |
| - this._storagePanel.showCategoryView(this._categoryName); |
| - return false; |
| - } |
| - |
| - /** |
| - * @override |
| - */ |
| - onattach() { |
| - super.onattach(); |
| - if (this._expandedSetting.get()) |
| - this.expand(); |
| - } |
| - |
| - /** |
| - * @override |
| - */ |
| - onexpand() { |
| - this._expandedSetting.set(true); |
| - } |
| - |
| - /** |
| - * @override |
| - */ |
| - oncollapse() { |
| - this._expandedSetting.set(false); |
| - } |
| -}; |
| - |
| -/** |
| - * @unrestricted |
| - */ |
| -Resources.FrameTreeElement = class extends Resources.BaseStorageTreeElement { |
| - /** |
| - * @param {!Resources.ResourcesPanel} storagePanel |
| - * @param {!SDK.ResourceTreeFrame} frame |
| - */ |
| - constructor(storagePanel, frame) { |
| - super(storagePanel, '', false); |
| - this._frame = frame; |
| - this.frameNavigated(frame); |
| - |
| - var icon = UI.Icon.create('largeicon-navigator-frame', 'navigator-tree-item'); |
| - icon.classList.add('navigator-frame-tree-item'); |
| - this.setLeadingIcons([icon]); |
| - } |
| - |
| - frameNavigated(frame) { |
| - this.removeChildren(); |
| - this._frameId = frame.id; |
| - this.title = frame.displayName(); |
| - this._categoryElements = {}; |
| - this._treeElementForResource = {}; |
| - |
| - this._storagePanel.addCookieDocument(frame); |
| - } |
| - |
| - get itemURL() { |
| - return 'frame://' + encodeURI(this.titleAsText()); |
| - } |
| - |
| - /** |
| - * @override |
| - * @return {boolean} |
| - */ |
| - onselect(selectedByUser) { |
| - super.onselect(selectedByUser); |
| - this._storagePanel.showCategoryView(this.titleAsText()); |
| - |
| - this.listItemElement.classList.remove('hovered'); |
| - SDK.DOMModel.hideDOMNodeHighlight(); |
| - return false; |
| - } |
| - |
| - set hovered(hovered) { |
| - if (hovered) { |
| - this.listItemElement.classList.add('hovered'); |
| - var domModel = SDK.DOMModel.fromTarget(this._frame.target()); |
| - if (domModel) |
| - domModel.highlightFrame(this._frameId); |
| - } else { |
| - this.listItemElement.classList.remove('hovered'); |
| - SDK.DOMModel.hideDOMNodeHighlight(); |
| - } |
| - } |
| - |
| - /** |
| - * @param {!SDK.Resource} resource |
| - */ |
| - appendResource(resource) { |
| - var resourceType = resource.resourceType(); |
| - var categoryName = resourceType.name(); |
| - var categoryElement = resourceType === Common.resourceTypes.Document ? this : this._categoryElements[categoryName]; |
| - if (!categoryElement) { |
| - categoryElement = new Resources.StorageCategoryTreeElement( |
| - this._storagePanel, resource.resourceType().category().title, categoryName); |
| - this._categoryElements[resourceType.name()] = categoryElement; |
| - this._insertInPresentationOrder(this, categoryElement); |
| - } |
| - var resourceTreeElement = new Resources.FrameResourceTreeElement(this._storagePanel, resource); |
| - this._insertInPresentationOrder(categoryElement, resourceTreeElement); |
| - this._treeElementForResource[resource.url] = resourceTreeElement; |
| - } |
| - |
| - /** |
| - * @param {string} url |
| - * @return {?SDK.Resource} |
| - */ |
| - resourceByURL(url) { |
| - var treeElement = this._treeElementForResource[url]; |
| - return treeElement ? treeElement._resource : null; |
| - } |
| - |
| - /** |
| - * @override |
| - */ |
| - appendChild(treeElement) { |
| - this._insertInPresentationOrder(this, treeElement); |
| - } |
| - |
| - _insertInPresentationOrder(parentTreeElement, childTreeElement) { |
| - // Insert in the alphabetical order, first frames, then resources. Document resource goes last. |
| - function typeWeight(treeElement) { |
| - if (treeElement instanceof Resources.StorageCategoryTreeElement) |
| - return 2; |
| - if (treeElement instanceof Resources.FrameTreeElement) |
| - return 1; |
| - return 3; |
| - } |
| - |
| - function compare(treeElement1, treeElement2) { |
| - var typeWeight1 = typeWeight(treeElement1); |
| - var typeWeight2 = typeWeight(treeElement2); |
| - |
| - var result; |
| - if (typeWeight1 > typeWeight2) |
| - result = 1; |
| - else if (typeWeight1 < typeWeight2) |
| - result = -1; |
| - else |
| - result = treeElement1.titleAsText().localeCompare(treeElement2.titleAsText()); |
| - return result; |
| - } |
| - |
| - var childCount = parentTreeElement.childCount(); |
| - var i; |
| - for (i = 0; i < childCount; ++i) { |
| - if (compare(childTreeElement, parentTreeElement.childAt(i)) < 0) |
| - break; |
| - } |
| - parentTreeElement.insertChild(childTreeElement, i); |
| - } |
| -}; |
| - |
| -/** |
| - * @unrestricted |
| - */ |
| -Resources.FrameResourceTreeElement = class extends Resources.BaseStorageTreeElement { |
| - /** |
| - * @param {!Resources.ResourcesPanel} storagePanel |
| - * @param {!SDK.Resource} resource |
| - */ |
| - constructor(storagePanel, resource) { |
| - super(storagePanel, resource.displayName, false); |
| - /** @type {!SDK.Resource} */ |
| - this._resource = resource; |
| - this.tooltip = resource.url; |
| - this._resource[Resources.FrameResourceTreeElement._symbol] = this; |
| - |
| - var icon = UI.Icon.create('largeicon-navigator-file', 'navigator-tree-item'); |
| - icon.classList.add('navigator-file-tree-item'); |
| - icon.classList.add('navigator-' + resource.resourceType().name() + '-tree-item'); |
| - this.setLeadingIcons([icon]); |
| - } |
| - |
| - get itemURL() { |
| - return this._resource.url; |
| - } |
| - |
| - /** |
| - * @override |
| - * @return {boolean} |
| - */ |
| - onselect(selectedByUser) { |
| - super.onselect(selectedByUser); |
| - this._storagePanel._showResourceView(this._resource); |
| - return false; |
| - } |
| - |
| - /** |
| - * @override |
| - * @return {boolean} |
| - */ |
| - ondblclick(event) { |
| - InspectorFrontendHost.openInNewTab(this._resource.url); |
| - return false; |
| - } |
| - |
| - /** |
| - * @override |
| - */ |
| - onattach() { |
| - super.onattach(); |
| - this.listItemElement.draggable = true; |
| - this.listItemElement.addEventListener('dragstart', this._ondragstart.bind(this), false); |
| - this.listItemElement.addEventListener('contextmenu', this._handleContextMenuEvent.bind(this), true); |
| - } |
| - |
| - /** |
| - * @param {!MouseEvent} event |
| - * @return {boolean} |
| - */ |
| - _ondragstart(event) { |
| - event.dataTransfer.setData('text/plain', this._resource.content || ''); |
| - event.dataTransfer.effectAllowed = 'copy'; |
| - return true; |
| - } |
| - |
| - _handleContextMenuEvent(event) { |
| - var contextMenu = new UI.ContextMenu(event); |
| - contextMenu.appendApplicableItems(this._resource); |
| - contextMenu.show(); |
| - } |
| - |
| - /** |
| - * @return {!SourceFrame.ResourceSourceFrame} |
| - */ |
| - sourceView() { |
| - if (!this._sourceView) { |
| - var sourceFrame = new SourceFrame.ResourceSourceFrame(this._resource); |
| - sourceFrame.setHighlighterType(this._resource.canonicalMimeType()); |
| - this._sourceView = sourceFrame; |
| - } |
| - return this._sourceView; |
| - } |
| -}; |
| - |
| -Resources.FrameResourceTreeElement._symbol = Symbol('treeElement'); |
| - |
| -/** |
| - * @unrestricted |
| - */ |
| -Resources.DatabaseTreeElement = class extends Resources.BaseStorageTreeElement { |
| - /** |
| - * @param {!Resources.ResourcesPanel} storagePanel |
| - * @param {!Resources.Database} database |
| - */ |
| - constructor(storagePanel, database) { |
| - super(storagePanel, database.name, true); |
| - this._database = database; |
| - |
| - var icon = UI.Icon.create('mediumicon-database', 'resource-tree-item'); |
| - this.setLeadingIcons([icon]); |
| - } |
| - |
| - get itemURL() { |
| - return 'database://' + encodeURI(this._database.name); |
| - } |
| - |
| - /** |
| - * @override |
| - * @return {boolean} |
| - */ |
| - onselect(selectedByUser) { |
| - super.onselect(selectedByUser); |
| - this._storagePanel._showDatabase(this._database); |
| - return false; |
| - } |
| - |
| - /** |
| - * @override |
| - */ |
| - onexpand() { |
| - this._updateChildren(); |
| - } |
| - |
| - _updateChildren() { |
| - this.removeChildren(); |
| - |
| - /** |
| - * @param {!Array.<string>} tableNames |
| - * @this {Resources.DatabaseTreeElement} |
| - */ |
| - function tableNamesCallback(tableNames) { |
| - var tableNamesLength = tableNames.length; |
| - for (var i = 0; i < tableNamesLength; ++i) |
| - this.appendChild(new Resources.DatabaseTableTreeElement(this._storagePanel, this._database, tableNames[i])); |
| - } |
| - this._database.getTableNames(tableNamesCallback.bind(this)); |
| - } |
| -}; |
| - |
| -/** |
| - * @unrestricted |
| - */ |
| -Resources.DatabaseTableTreeElement = class extends Resources.BaseStorageTreeElement { |
| - constructor(storagePanel, database, tableName) { |
| - super(storagePanel, tableName, false); |
| - this._database = database; |
| - this._tableName = tableName; |
| - var icon = UI.Icon.create('mediumicon-table', 'resource-tree-item'); |
| - this.setLeadingIcons([icon]); |
| - } |
| - |
| - get itemURL() { |
| - return 'database://' + encodeURI(this._database.name) + '/' + encodeURI(this._tableName); |
| - } |
| - |
| - /** |
| - * @override |
| - * @return {boolean} |
| - */ |
| - onselect(selectedByUser) { |
| - super.onselect(selectedByUser); |
| - this._storagePanel._showDatabase(this._database, this._tableName); |
| - return false; |
| - } |
| -}; |
| - |
| -/** |
| - * @unrestricted |
| - */ |
| -Resources.ServiceWorkerCacheTreeElement = class extends Resources.StorageCategoryTreeElement { |
| - /** |
| - * @param {!Resources.ResourcesPanel} storagePanel |
| - */ |
| - constructor(storagePanel) { |
| - super(storagePanel, Common.UIString('Cache Storage'), 'CacheStorage'); |
| - var icon = UI.Icon.create('mediumicon-database', 'resource-tree-item'); |
| - this.setLeadingIcons([icon]); |
| - } |
| - |
| - _initialize() { |
| - /** @type {!Array.<!Resources.SWCacheTreeElement>} */ |
| - this._swCacheTreeElements = []; |
| - var target = this._storagePanel._target; |
| - var model = target && SDK.ServiceWorkerCacheModel.fromTarget(target); |
| - if (model) { |
| - for (var cache of model.caches()) |
| - this._addCache(model, cache); |
| - } |
| - SDK.targetManager.addModelListener( |
| - SDK.ServiceWorkerCacheModel, SDK.ServiceWorkerCacheModel.Events.CacheAdded, this._cacheAdded, this); |
| - SDK.targetManager.addModelListener( |
| - SDK.ServiceWorkerCacheModel, SDK.ServiceWorkerCacheModel.Events.CacheRemoved, this._cacheRemoved, this); |
| - } |
| - |
| - /** |
| - * @override |
| - */ |
| - onattach() { |
| - super.onattach(); |
| - this.listItemElement.addEventListener('contextmenu', this._handleContextMenuEvent.bind(this), true); |
| - } |
| - |
| - _handleContextMenuEvent(event) { |
| - var contextMenu = new UI.ContextMenu(event); |
| - contextMenu.appendItem(Common.UIString('Refresh Caches'), this._refreshCaches.bind(this)); |
| - contextMenu.show(); |
| - } |
| - |
| - _refreshCaches() { |
| - var target = this._storagePanel._target; |
| - if (target) { |
| - var model = SDK.ServiceWorkerCacheModel.fromTarget(target); |
| - if (!model) |
| - return; |
| - model.refreshCacheNames(); |
| - } |
| - } |
| - |
| - /** |
| - * @param {!Common.Event} event |
| - */ |
| - _cacheAdded(event) { |
| - var cache = /** @type {!SDK.ServiceWorkerCacheModel.Cache} */ (event.data.cache); |
| - var model = /** @type {!SDK.ServiceWorkerCacheModel} */ (event.data.model); |
| - this._addCache(model, cache); |
| - } |
| - |
| - /** |
| - * @param {!SDK.ServiceWorkerCacheModel} model |
| - * @param {!SDK.ServiceWorkerCacheModel.Cache} cache |
| - */ |
| - _addCache(model, cache) { |
| - var swCacheTreeElement = new Resources.SWCacheTreeElement(this._storagePanel, model, cache); |
| - this._swCacheTreeElements.push(swCacheTreeElement); |
| - this.appendChild(swCacheTreeElement); |
| - } |
| - |
| - /** |
| - * @param {!Common.Event} event |
| - */ |
| - _cacheRemoved(event) { |
| - var cache = /** @type {!SDK.ServiceWorkerCacheModel.Cache} */ (event.data.cache); |
| - var model = /** @type {!SDK.ServiceWorkerCacheModel} */ (event.data.model); |
| - |
| - var swCacheTreeElement = this._cacheTreeElement(model, cache); |
| - if (!swCacheTreeElement) |
| - return; |
| - |
| - swCacheTreeElement.clear(); |
| - this.removeChild(swCacheTreeElement); |
| - this._swCacheTreeElements.remove(swCacheTreeElement); |
| - } |
| - |
| - /** |
| - * @param {!SDK.ServiceWorkerCacheModel} model |
| - * @param {!SDK.ServiceWorkerCacheModel.Cache} cache |
| - * @return {?Resources.SWCacheTreeElement} |
| - */ |
| - _cacheTreeElement(model, cache) { |
| - var index = -1; |
| - for (var i = 0; i < this._swCacheTreeElements.length; ++i) { |
| - if (this._swCacheTreeElements[i]._cache.equals(cache) && this._swCacheTreeElements[i]._model === model) { |
| - index = i; |
| - break; |
| - } |
| - } |
| - if (index !== -1) |
| - return this._swCacheTreeElements[i]; |
| - return null; |
| - } |
| -}; |
| - |
| -/** |
| - * @unrestricted |
| - */ |
| -Resources.SWCacheTreeElement = class extends Resources.BaseStorageTreeElement { |
| - /** |
| - * @param {!Resources.ResourcesPanel} storagePanel |
| - * @param {!SDK.ServiceWorkerCacheModel} model |
| - * @param {!SDK.ServiceWorkerCacheModel.Cache} cache |
| - */ |
| - constructor(storagePanel, model, cache) { |
| - super(storagePanel, cache.cacheName + ' - ' + cache.securityOrigin, false); |
| - this._model = model; |
| - this._cache = cache; |
| - var icon = UI.Icon.create('mediumicon-table', 'resource-tree-item'); |
| - this.setLeadingIcons([icon]); |
| - } |
| - |
| - get itemURL() { |
| - // I don't think this will work at all. |
| - return 'cache://' + this._cache.cacheId; |
| - } |
| - |
| - /** |
| - * @override |
| - */ |
| - onattach() { |
| - super.onattach(); |
| - this.listItemElement.addEventListener('contextmenu', this._handleContextMenuEvent.bind(this), true); |
| - } |
| - |
| - _handleContextMenuEvent(event) { |
| - var contextMenu = new UI.ContextMenu(event); |
| - contextMenu.appendItem(Common.UIString('Delete'), this._clearCache.bind(this)); |
| - contextMenu.show(); |
| - } |
| - |
| - _clearCache() { |
| - this._model.deleteCache(this._cache); |
| - } |
| - |
| - /** |
| - * @param {!SDK.ServiceWorkerCacheModel.Cache} cache |
| - */ |
| - update(cache) { |
| - this._cache = cache; |
| - if (this._view) |
| - this._view.update(cache); |
| - } |
| - |
| - /** |
| - * @override |
| - * @return {boolean} |
| - */ |
| - onselect(selectedByUser) { |
| - super.onselect(selectedByUser); |
| - if (!this._view) |
| - this._view = new Resources.ServiceWorkerCacheView(this._model, this._cache); |
| - |
| - this._storagePanel._innerShowView(this._view); |
| - return false; |
| - } |
| - |
| - clear() { |
| - if (this._view) |
| - this._view.clear(); |
| - } |
| -}; |
| - |
| -/** |
| - * @unrestricted |
| - */ |
| -Resources.ServiceWorkersTreeElement = class extends Resources.BaseStorageTreeElement { |
| - /** |
| - * @param {!Resources.ResourcesPanel} storagePanel |
| - */ |
| - constructor(storagePanel) { |
| - super(storagePanel, Common.UIString('Service Workers'), false); |
| - var icon = UI.Icon.create('mediumicon-service-worker', 'resource-tree-item'); |
| - this.setLeadingIcons([icon]); |
| - } |
| - |
| - /** |
| - * @return {string} |
| - */ |
| - get itemURL() { |
| - return 'service-workers://'; |
| - } |
| - |
| - /** |
| - * @override |
| - * @return {boolean} |
| - */ |
| - onselect(selectedByUser) { |
| - super.onselect(selectedByUser); |
| - if (!this._view) |
| - this._view = new Resources.ServiceWorkersView(); |
| - this._storagePanel._innerShowView(this._view); |
| - return false; |
| - } |
| -}; |
| - |
| -/** |
| - * @unrestricted |
| - */ |
| -Resources.AppManifestTreeElement = class extends Resources.BaseStorageTreeElement { |
| - /** |
| - * @param {!Resources.ResourcesPanel} storagePanel |
| - */ |
| - constructor(storagePanel) { |
| - super(storagePanel, Common.UIString('Manifest'), false); |
| - var icon = UI.Icon.create('mediumicon-manifest', 'resource-tree-item'); |
| - this.setLeadingIcons([icon]); |
| - } |
| - |
| - /** |
| - * @return {string} |
| - */ |
| - get itemURL() { |
| - return 'manifest://'; |
| - } |
| - |
| - /** |
| - * @override |
| - * @return {boolean} |
| - */ |
| - onselect(selectedByUser) { |
| - super.onselect(selectedByUser); |
| - if (!this._view) |
| - this._view = new Resources.AppManifestView(); |
| - this._storagePanel._innerShowView(this._view); |
| - return false; |
| - } |
| -}; |
| - |
| -/** |
| - * @unrestricted |
| - */ |
| -Resources.ClearStorageTreeElement = class extends Resources.BaseStorageTreeElement { |
| - /** |
| - * @param {!Resources.ResourcesPanel} storagePanel |
| - */ |
| - constructor(storagePanel) { |
| - super(storagePanel, Common.UIString('Clear storage'), false); |
| - var icon = UI.Icon.create('mediumicon-clear-storage', 'resource-tree-item'); |
| - this.setLeadingIcons([icon]); |
| - } |
| - |
| - /** |
| - * @return {string} |
| - */ |
| - get itemURL() { |
| - return 'clear-storage://'; |
| - } |
| - |
| - /** |
| - * @override |
| - * @return {boolean} |
| - */ |
| - onselect(selectedByUser) { |
| - super.onselect(selectedByUser); |
| - if (!this._view) |
| - this._view = new Resources.ClearStorageView(this._storagePanel); |
| - this._storagePanel._innerShowView(this._view); |
| - return false; |
| - } |
| -}; |
| - |
| -/** |
| - * @unrestricted |
| - */ |
| -Resources.IndexedDBTreeElement = class extends Resources.StorageCategoryTreeElement { |
| - /** |
| - * @param {!Resources.ResourcesPanel} storagePanel |
| - */ |
| - constructor(storagePanel) { |
| - super(storagePanel, Common.UIString('IndexedDB'), 'IndexedDB'); |
| - var icon = UI.Icon.create('mediumicon-database', 'resource-tree-item'); |
| - this.setLeadingIcons([icon]); |
| - } |
| - |
| - _initialize() { |
| - SDK.targetManager.addModelListener( |
| - Resources.IndexedDBModel, Resources.IndexedDBModel.Events.DatabaseAdded, this._indexedDBAdded, this); |
| - SDK.targetManager.addModelListener( |
| - Resources.IndexedDBModel, Resources.IndexedDBModel.Events.DatabaseRemoved, this._indexedDBRemoved, this); |
| - SDK.targetManager.addModelListener( |
| - Resources.IndexedDBModel, Resources.IndexedDBModel.Events.DatabaseLoaded, this._indexedDBLoaded, this); |
| - /** @type {!Array.<!Resources.IDBDatabaseTreeElement>} */ |
| - this._idbDatabaseTreeElements = []; |
| - |
| - var targets = SDK.targetManager.targets(SDK.Target.Capability.Browser); |
| - for (var i = 0; i < targets.length; ++i) { |
| - var indexedDBModel = Resources.IndexedDBModel.fromTarget(targets[i]); |
| - var databases = indexedDBModel.databases(); |
| - for (var j = 0; j < databases.length; ++j) |
| - this._addIndexedDB(indexedDBModel, databases[j]); |
| - } |
| - } |
| - |
| - /** |
| - * @override |
| - */ |
| - onattach() { |
| - super.onattach(); |
| - this.listItemElement.addEventListener('contextmenu', this._handleContextMenuEvent.bind(this), true); |
| - } |
| - |
| - _handleContextMenuEvent(event) { |
| - var contextMenu = new UI.ContextMenu(event); |
| - contextMenu.appendItem(Common.UIString('Refresh IndexedDB'), this.refreshIndexedDB.bind(this)); |
| - contextMenu.show(); |
| - } |
| - |
| - refreshIndexedDB() { |
| - var targets = SDK.targetManager.targets(SDK.Target.Capability.Browser); |
| - for (var i = 0; i < targets.length; ++i) |
| - Resources.IndexedDBModel.fromTarget(targets[i]).refreshDatabaseNames(); |
| - } |
| - |
| - /** |
| - * @param {!Common.Event} event |
| - */ |
| - _indexedDBAdded(event) { |
| - var databaseId = /** @type {!Resources.IndexedDBModel.DatabaseId} */ (event.data.databaseId); |
| - var model = /** @type {!Resources.IndexedDBModel} */ (event.data.model); |
| - this._addIndexedDB(model, databaseId); |
| - } |
| - |
| - /** |
| - * @param {!Resources.IndexedDBModel} model |
| - * @param {!Resources.IndexedDBModel.DatabaseId} databaseId |
| - */ |
| - _addIndexedDB(model, databaseId) { |
| - var idbDatabaseTreeElement = new Resources.IDBDatabaseTreeElement(this._storagePanel, model, databaseId); |
| - this._idbDatabaseTreeElements.push(idbDatabaseTreeElement); |
| - this.appendChild(idbDatabaseTreeElement); |
| - model.refreshDatabase(databaseId); |
| - } |
| - |
| - /** |
| - * @param {!Common.Event} event |
| - */ |
| - _indexedDBRemoved(event) { |
| - var databaseId = /** @type {!Resources.IndexedDBModel.DatabaseId} */ (event.data.databaseId); |
| - var model = /** @type {!Resources.IndexedDBModel} */ (event.data.model); |
| - |
| - var idbDatabaseTreeElement = this._idbDatabaseTreeElement(model, databaseId); |
| - if (!idbDatabaseTreeElement) |
| - return; |
| - |
| - idbDatabaseTreeElement.clear(); |
| - this.removeChild(idbDatabaseTreeElement); |
| - this._idbDatabaseTreeElements.remove(idbDatabaseTreeElement); |
| - } |
| - |
| - /** |
| - * @param {!Common.Event} event |
| - */ |
| - _indexedDBLoaded(event) { |
| - var database = /** @type {!Resources.IndexedDBModel.Database} */ (event.data.database); |
| - var model = /** @type {!Resources.IndexedDBModel} */ (event.data.model); |
| - |
| - var idbDatabaseTreeElement = this._idbDatabaseTreeElement(model, database.databaseId); |
| - if (!idbDatabaseTreeElement) |
| - return; |
| - |
| - idbDatabaseTreeElement.update(database); |
| - } |
| - |
| - /** |
| - * @param {!Resources.IndexedDBModel.DatabaseId} databaseId |
| - * @param {!Resources.IndexedDBModel} model |
| - * @return {?Resources.IDBDatabaseTreeElement} |
| - */ |
| - _idbDatabaseTreeElement(model, databaseId) { |
| - var index = -1; |
| - for (var i = 0; i < this._idbDatabaseTreeElements.length; ++i) { |
| - if (this._idbDatabaseTreeElements[i]._databaseId.equals(databaseId) && |
| - this._idbDatabaseTreeElements[i]._model === model) { |
| - index = i; |
| - break; |
| - } |
| - } |
| - if (index !== -1) |
| - return this._idbDatabaseTreeElements[i]; |
| - return null; |
| - } |
| -}; |
| - |
| -/** |
| - * @unrestricted |
| - */ |
| -Resources.IDBDatabaseTreeElement = class extends Resources.BaseStorageTreeElement { |
| - /** |
| - * @param {!Resources.ResourcesPanel} storagePanel |
| - * @param {!Resources.IndexedDBModel} model |
| - * @param {!Resources.IndexedDBModel.DatabaseId} databaseId |
| - */ |
| - constructor(storagePanel, model, databaseId) { |
| - super(storagePanel, databaseId.name + ' - ' + databaseId.securityOrigin, false); |
| - this._model = model; |
| - this._databaseId = databaseId; |
| - this._idbObjectStoreTreeElements = {}; |
| - var icon = UI.Icon.create('mediumicon-database', 'resource-tree-item'); |
| - this.setLeadingIcons([icon]); |
| - } |
| - |
| - get itemURL() { |
| - return 'indexedDB://' + this._databaseId.securityOrigin + '/' + this._databaseId.name; |
| - } |
| - |
| - /** |
| - * @override |
| - */ |
| - onattach() { |
| - super.onattach(); |
| - this.listItemElement.addEventListener('contextmenu', this._handleContextMenuEvent.bind(this), true); |
| - } |
| - |
| - _handleContextMenuEvent(event) { |
| - var contextMenu = new UI.ContextMenu(event); |
| - contextMenu.appendItem(Common.UIString('Refresh IndexedDB'), this._refreshIndexedDB.bind(this)); |
| - contextMenu.show(); |
| - } |
| - |
| - _refreshIndexedDB() { |
| - this._model.refreshDatabaseNames(); |
| - } |
| - |
| - /** |
| - * @param {!Resources.IndexedDBModel.Database} database |
| - */ |
| - update(database) { |
| - this._database = database; |
| - var objectStoreNames = {}; |
| - for (var objectStoreName in this._database.objectStores) { |
| - var objectStore = this._database.objectStores[objectStoreName]; |
| - objectStoreNames[objectStore.name] = true; |
| - if (!this._idbObjectStoreTreeElements[objectStore.name]) { |
| - var idbObjectStoreTreeElement = |
| - new Resources.IDBObjectStoreTreeElement(this._storagePanel, this._model, this._databaseId, objectStore); |
| - this._idbObjectStoreTreeElements[objectStore.name] = idbObjectStoreTreeElement; |
| - this.appendChild(idbObjectStoreTreeElement); |
| - } |
| - this._idbObjectStoreTreeElements[objectStore.name].update(objectStore); |
| - } |
| - for (var objectStoreName in this._idbObjectStoreTreeElements) { |
| - if (!objectStoreNames[objectStoreName]) |
| - this._objectStoreRemoved(objectStoreName); |
| - } |
| - |
| - if (this._view) |
| - this._view.update(database); |
| - |
| - this._updateTooltip(); |
| - } |
| - |
| - _updateTooltip() { |
| - this.tooltip = Common.UIString('Version') + ': ' + this._database.version; |
| - } |
| - |
| - /** |
| - * @override |
| - * @return {boolean} |
| - */ |
| - onselect(selectedByUser) { |
| - super.onselect(selectedByUser); |
| - if (!this._view) |
| - this._view = new Resources.IDBDatabaseView(this._model, this._database); |
| - |
| - this._storagePanel._innerShowView(this._view); |
| - return false; |
| - } |
| - |
| - /** |
| - * @param {string} objectStoreName |
| - */ |
| - _objectStoreRemoved(objectStoreName) { |
| - var objectStoreTreeElement = this._idbObjectStoreTreeElements[objectStoreName]; |
| - objectStoreTreeElement.clear(); |
| - this.removeChild(objectStoreTreeElement); |
| - delete this._idbObjectStoreTreeElements[objectStoreName]; |
| - } |
| - |
| - clear() { |
| - for (var objectStoreName in this._idbObjectStoreTreeElements) |
| - this._objectStoreRemoved(objectStoreName); |
| - } |
| -}; |
| - |
| -/** |
| - * @unrestricted |
| - */ |
| -Resources.IDBObjectStoreTreeElement = class extends Resources.BaseStorageTreeElement { |
| - /** |
| - * @param {!Resources.ResourcesPanel} storagePanel |
| - * @param {!Resources.IndexedDBModel} model |
| - * @param {!Resources.IndexedDBModel.DatabaseId} databaseId |
| - * @param {!Resources.IndexedDBModel.ObjectStore} objectStore |
| - */ |
| - constructor(storagePanel, model, databaseId, objectStore) { |
| - super(storagePanel, objectStore.name, false); |
| - this._model = model; |
| - this._databaseId = databaseId; |
| - this._idbIndexTreeElements = {}; |
| - var icon = UI.Icon.create('mediumicon-table', 'resource-tree-item'); |
| - this.setLeadingIcons([icon]); |
| - } |
| - |
| - get itemURL() { |
| - return 'indexedDB://' + this._databaseId.securityOrigin + '/' + this._databaseId.name + '/' + |
| - this._objectStore.name; |
| - } |
| - |
| - /** |
| - * @override |
| - */ |
| - onattach() { |
| - super.onattach(); |
| - this.listItemElement.addEventListener('contextmenu', this._handleContextMenuEvent.bind(this), true); |
| + _ondragstart(event) { |
| + event.dataTransfer.setData('text/plain', this._resource.content || ''); |
| + event.dataTransfer.effectAllowed = 'copy'; |
| + return true; |
| } |
| _handleContextMenuEvent(event) { |
| var contextMenu = new UI.ContextMenu(event); |
| - contextMenu.appendItem(Common.UIString('Clear'), this._clearObjectStore.bind(this)); |
| + contextMenu.appendApplicableItems(this._resource); |
| contextMenu.show(); |
| } |
| - _clearObjectStore() { |
| - /** |
| - * @this {Resources.IDBObjectStoreTreeElement} |
| - */ |
| - function callback() { |
| - this.update(this._objectStore); |
| - } |
| - this._model.clearObjectStore(this._databaseId, this._objectStore.name, callback.bind(this)); |
| - } |
| - |
| /** |
| - * @param {!Resources.IndexedDBModel.ObjectStore} objectStore |
| + * @return {!SourceFrame.ResourceSourceFrame} |
| */ |
| - update(objectStore) { |
| - this._objectStore = objectStore; |
| - |
| - var indexNames = {}; |
| - for (var indexName in this._objectStore.indexes) { |
| - var index = this._objectStore.indexes[indexName]; |
| - indexNames[index.name] = true; |
| - if (!this._idbIndexTreeElements[index.name]) { |
| - var idbIndexTreeElement = new Resources.IDBIndexTreeElement( |
| - this._storagePanel, this._model, this._databaseId, this._objectStore, index); |
| - this._idbIndexTreeElements[index.name] = idbIndexTreeElement; |
| - this.appendChild(idbIndexTreeElement); |
| - } |
| - this._idbIndexTreeElements[index.name].update(index); |
| - } |
| - for (var indexName in this._idbIndexTreeElements) { |
| - if (!indexNames[indexName]) |
| - this._indexRemoved(indexName); |
| + _sourceView() { |
| + if (!this._sourceFrame) { |
| + this._sourceFrame = new SourceFrame.ResourceSourceFrame(this._resource); |
| + this._sourceFrame.setHighlighterType(this._resource.canonicalMimeType()); |
| } |
| - for (var indexName in this._idbIndexTreeElements) { |
| - if (!indexNames[indexName]) { |
| - this.removeChild(this._idbIndexTreeElements[indexName]); |
| - delete this._idbIndexTreeElements[indexName]; |
| - } |
| - } |
| - |
| - if (this.childCount()) |
| - this.expand(); |
| - |
| - if (this._view) |
| - this._view.update(this._objectStore); |
| - |
| - this._updateTooltip(); |
| - } |
| - |
| - _updateTooltip() { |
| - var keyPathString = this._objectStore.keyPathString; |
| - var tooltipString = keyPathString !== null ? (Common.UIString('Key path: ') + keyPathString) : ''; |
| - if (this._objectStore.autoIncrement) |
| - tooltipString += '\n' + Common.UIString('autoIncrement'); |
| - this.tooltip = tooltipString; |
| - } |
| - |
| - /** |
| - * @override |
| - * @return {boolean} |
| - */ |
| - onselect(selectedByUser) { |
| - super.onselect(selectedByUser); |
| - if (!this._view) |
| - this._view = new Resources.IDBDataView(this._model, this._databaseId, this._objectStore, null); |
| - |
| - this._storagePanel._innerShowView(this._view); |
| - return false; |
| - } |
| - |
| - /** |
| - * @param {string} indexName |
| - */ |
| - _indexRemoved(indexName) { |
| - var indexTreeElement = this._idbIndexTreeElements[indexName]; |
| - indexTreeElement.clear(); |
| - this.removeChild(indexTreeElement); |
| - delete this._idbIndexTreeElements[indexName]; |
| - } |
| - |
| - clear() { |
| - for (var indexName in this._idbIndexTreeElements) |
| - this._indexRemoved(indexName); |
| - if (this._view) |
| - this._view.clear(); |
| - } |
| -}; |
| - |
| -/** |
| - * @unrestricted |
| - */ |
| -Resources.IDBIndexTreeElement = class extends Resources.BaseStorageTreeElement { |
| - /** |
| - * @param {!Resources.ResourcesPanel} storagePanel |
| - * @param {!Resources.IndexedDBModel} model |
| - * @param {!Resources.IndexedDBModel.DatabaseId} databaseId |
| - * @param {!Resources.IndexedDBModel.ObjectStore} objectStore |
| - * @param {!Resources.IndexedDBModel.Index} index |
| - */ |
| - constructor(storagePanel, model, databaseId, objectStore, index) { |
| - super(storagePanel, index.name, false); |
| - this._model = model; |
| - this._databaseId = databaseId; |
| - this._objectStore = objectStore; |
| - this._index = index; |
| - } |
| - |
| - get itemURL() { |
| - return 'indexedDB://' + this._databaseId.securityOrigin + '/' + this._databaseId.name + '/' + |
| - this._objectStore.name + '/' + this._index.name; |
| - } |
| - |
| - /** |
| - * @param {!Resources.IndexedDBModel.Index} index |
| - */ |
| - update(index) { |
| - this._index = index; |
| - |
| - if (this._view) |
| - this._view.update(this._index); |
| - |
| - this._updateTooltip(); |
| - } |
| - |
| - _updateTooltip() { |
| - var tooltipLines = []; |
| - var keyPathString = this._index.keyPathString; |
| - tooltipLines.push(Common.UIString('Key path: ') + keyPathString); |
| - if (this._index.unique) |
| - tooltipLines.push(Common.UIString('unique')); |
| - if (this._index.multiEntry) |
| - tooltipLines.push(Common.UIString('multiEntry')); |
| - this.tooltip = tooltipLines.join('\n'); |
| - } |
| - |
| - /** |
| - * @override |
| - * @return {boolean} |
| - */ |
| - onselect(selectedByUser) { |
| - super.onselect(selectedByUser); |
| - if (!this._view) |
| - this._view = new Resources.IDBDataView(this._model, this._databaseId, this._objectStore, this._index); |
| - |
| - this._storagePanel._innerShowView(this._view); |
| - return false; |
| - } |
| - |
| - clear() { |
| - if (this._view) |
| - this._view.clear(); |
| - } |
| -}; |
| - |
| -/** |
| - * @unrestricted |
| - */ |
| -Resources.DOMStorageTreeElement = class extends Resources.BaseStorageTreeElement { |
| - constructor(storagePanel, domStorage) { |
| - super(storagePanel, domStorage.securityOrigin ? domStorage.securityOrigin : Common.UIString('Local Files'), false); |
| - this._domStorage = domStorage; |
| - var icon = UI.Icon.create('mediumicon-table', 'resource-tree-item'); |
| - this.setLeadingIcons([icon]); |
| - } |
| - |
| - get itemURL() { |
| - return 'storage://' + this._domStorage.securityOrigin + '/' + |
| - (this._domStorage.isLocalStorage ? 'local' : 'session'); |
| - } |
| - |
| - /** |
| - * @override |
| - * @return {boolean} |
| - */ |
| - onselect(selectedByUser) { |
| - super.onselect(selectedByUser); |
| - this._storagePanel._showDOMStorage(this._domStorage); |
| - return false; |
| - } |
| - |
| - /** |
| - * @override |
| - */ |
| - onattach() { |
| - super.onattach(); |
| - this.listItemElement.addEventListener('contextmenu', this._handleContextMenuEvent.bind(this), true); |
| - } |
| - |
| - _handleContextMenuEvent(event) { |
| - var contextMenu = new UI.ContextMenu(event); |
| - contextMenu.appendItem(Common.UIString('Clear'), () => this._domStorage.clear()); |
| - contextMenu.show(); |
| - } |
| -}; |
| - |
| -Resources.CookieTreeElement = class extends Resources.BaseStorageTreeElement { |
| - /** |
| - * @param {!Resources.ResourcesPanel} storagePanel |
| - * @param {!SDK.ResourceTreeFrame} frame |
| - * @param {string} cookieDomain |
| - */ |
| - constructor(storagePanel, frame, cookieDomain) { |
| - super(storagePanel, cookieDomain ? cookieDomain : Common.UIString('Local Files'), false); |
| - this._target = frame.target(); |
| - this._cookieDomain = cookieDomain; |
| - var icon = UI.Icon.create('mediumicon-cookie', 'resource-tree-item'); |
| - this.setLeadingIcons([icon]); |
| - } |
| - |
| - get itemURL() { |
| - return 'cookies://' + this._cookieDomain; |
| - } |
| - |
| - /** |
| - * @override |
| - */ |
| - onattach() { |
| - super.onattach(); |
| - this.listItemElement.addEventListener('contextmenu', this._handleContextMenuEvent.bind(this), true); |
| - } |
| - |
| - /** |
| - * @param {!Event} event |
| - */ |
| - _handleContextMenuEvent(event) { |
| - var contextMenu = new UI.ContextMenu(event); |
| - contextMenu.appendItem( |
| - Common.UIString('Clear'), () => this._storagePanel._clearCookies(this._target, this._cookieDomain)); |
| - contextMenu.show(); |
| - } |
| - |
| - /** |
| - * @override |
| - * @return {boolean} |
| - */ |
| - onselect(selectedByUser) { |
| - super.onselect(selectedByUser); |
| - this._storagePanel.showCookies(this, this._cookieDomain, this._target); |
| - return false; |
| - } |
| -}; |
| - |
| -/** |
| - * @unrestricted |
| - */ |
| -Resources.ApplicationCacheManifestTreeElement = class extends Resources.BaseStorageTreeElement { |
| - constructor(storagePanel, manifestURL) { |
| - var title = new Common.ParsedURL(manifestURL).displayName; |
| - super(storagePanel, title, false); |
| - this.tooltip = manifestURL; |
| - this._manifestURL = manifestURL; |
| - } |
| - |
| - get itemURL() { |
| - return 'appcache://' + this._manifestURL; |
| - } |
| - |
| - get manifestURL() { |
| - return this._manifestURL; |
| - } |
| - |
| - /** |
| - * @override |
| - * @return {boolean} |
| - */ |
| - onselect(selectedByUser) { |
| - super.onselect(selectedByUser); |
| - this._storagePanel.showCategoryView(this._manifestURL); |
| - return false; |
| - } |
| -}; |
| - |
| -/** |
| - * @unrestricted |
| - */ |
| -Resources.ApplicationCacheFrameTreeElement = class extends Resources.BaseStorageTreeElement { |
| - /** |
| - * @param {!Resources.ResourcesPanel} storagePanel |
| - * @param {!Protocol.Page.FrameId} frameId |
| - * @param {string} manifestURL |
| - */ |
| - constructor(storagePanel, frameId, manifestURL) { |
| - super(storagePanel, '', false); |
| - this._frameId = frameId; |
| - this._manifestURL = manifestURL; |
| - this._refreshTitles(); |
| - |
| - var icon = UI.Icon.create('largeicon-navigator-folder', 'navigator-tree-item'); |
| - icon.classList.add('navigator-folder-tree-item'); |
| - this.setLeadingIcons([icon]); |
| - } |
| - |
| - get itemURL() { |
| - return 'appcache://' + this._manifestURL + '/' + encodeURI(this.titleAsText()); |
| - } |
| - |
| - get frameId() { |
| - return this._frameId; |
| - } |
| - |
| - get manifestURL() { |
| - return this._manifestURL; |
| - } |
| - |
| - _refreshTitles() { |
| - var resourceTreeModel = SDK.ResourceTreeModel.fromTarget(this._storagePanel._target); |
| - var frame = resourceTreeModel.frameForId(this._frameId); |
| - this.title = frame.displayName(); |
| - } |
| - |
| - frameNavigated() { |
| - this._refreshTitles(); |
| - } |
| - |
| - /** |
| - * @override |
| - * @return {boolean} |
| - */ |
| - onselect(selectedByUser) { |
| - super.onselect(selectedByUser); |
| - this._storagePanel.showApplicationCache(this._frameId); |
| - return false; |
| + return this._sourceFrame; |
| } |
| }; |
| -/** |
| - * @unrestricted |
| - */ |
| -Resources.StorageCategoryView = class extends UI.VBox { |
| - constructor() { |
| - super(); |
| - |
| - this.element.classList.add('storage-view'); |
| - this._emptyWidget = new UI.EmptyWidget(''); |
| - this._emptyWidget.show(this.element); |
| - } |
| - |
| - setText(text) { |
| - this._emptyWidget.text = text; |
| - } |
| -}; |
| +Resources.FrameResourceTreeElement._symbol = Symbol('treeElement'); |
