[Storage] Cache storage inspection on all the frames!

Source/devtools/front_end/resources/ResourcesPanel.js

Index: Source/devtools/front_end/resources/ResourcesPanel.js
diff --git a/Source/devtools/front_end/resources/ResourcesPanel.js b/Source/devtools/front_end/resources/ResourcesPanel.js
index b91990261905428bb9921d7f4ae5cd8cae0336e7..79fbaae885f5edd87bde3c71ff0ac42ce6c00027 100644
--- a/Source/devtools/front_end/resources/ResourcesPanel.js
+++ b/Source/devtools/front_end/resources/ResourcesPanel.js
@@ -66,6 +66,9 @@ WebInspector.ResourcesPanel = function()
     this.applicationCacheListTreeElement = new WebInspector.StorageCategoryTreeElement(this, WebInspector.UIString("Application Cache"), "ApplicationCache", ["application-cache-storage-tree-item"]);
     this._sidebarTree.appendChild(this.applicationCacheListTreeElement);
 
+    this.serviceWorkerCacheListTreeElement = new WebInspector.ServiceWorkerCacheTreeElement(this);
+    this._sidebarTree.appendChild(this.serviceWorkerCacheListTreeElement);
+
     if (Runtime.experiments.isEnabled("fileSystemInspection")) {
         this.fileSystemListTreeElement = new WebInspector.FileSystemListTreeElement(this);
         this._sidebarTree.appendChild(this.fileSystemListTreeElement);
@@ -122,11 +125,6 @@ WebInspector.ResourcesPanel.prototype = {
             return;
         this._target = target;
 
-        if (target.isServiceWorker()) {
-            this.serviceWorkerCacheListTreeElement = new WebInspector.ServiceWorkerCacheTreeElement(this);
-            this._sidebarTree.appendChild(this.serviceWorkerCacheListTreeElement);
-        }
-
         if (target.serviceWorkerManager && Runtime.experiments.isEnabled("serviceWorkersInResources")) {
             this.serviceWorkersTreeElement = new WebInspector.ServiceWorkersTreeElement(this);
             this._sidebarTree.appendChild(this.serviceWorkersTreeElement);
@@ -167,6 +165,7 @@ WebInspector.ResourcesPanel.prototype = {
         this._databaseModel.enable();
         this._domStorageModel.enable();
         WebInspector.IndexedDBModel.fromTarget(this._target).enable();
+        WebInspector.ServiceWorkerCacheModel.fromTarget(this._target).enable();
 
         if (this._target.isPage())
             this._populateResourceTree();
@@ -1422,11 +1421,10 @@ WebInspector.DatabaseTableTreeElement.prototype = {
  * @constructor
  * @extends {WebInspector.StorageCategoryTreeElement}
  * @param {!WebInspector.ResourcesPanel} storagePanel
- * @implements {WebInspector.TargetManager.Observer}
  */
 WebInspector.ServiceWorkerCacheTreeElement = function(storagePanel)
 {
-    WebInspector.StorageCategoryTreeElement.call(this, storagePanel, WebInspector.UIString("Service Worker Cache"), "ServiceWorkerCache", ["service-worker-cache-storage-tree-item"]);
+    WebInspector.StorageCategoryTreeElement.call(this, storagePanel, WebInspector.UIString("Cache Storage"), "Cache Storage", ["service-worker-cache-storage-tree-item"]);

[pfeldman, 2015/04/01 07:01:09]

"Cache Storage" -> "CacheStorage"

[dmurph, 2015/04/02 20:59:02]

Done.

 }
 
 WebInspector.ServiceWorkerCacheTreeElement.prototype = {
@@ -1435,17 +1433,14 @@ WebInspector.ServiceWorkerCacheTreeElement.prototype = {
         /** @type {!Array.<!WebInspector.SWCacheTreeElement>} */
         this._swCacheTreeElements = [];
         var targets = WebInspector.targetManager.targets();
-        for (var i = 0; i < targets.length; ++i) {
-            if (!targets[i].serviceWorkerCacheModel)
-                continue;
-            var caches = targets[i].serviceWorkerCacheModel.caches();
-            for (var j = 0; j < caches.length; ++j)
-                this._addCache(targets[i].serviceWorkerCacheModel, caches[j]);
+        for (var target of targets) {

[pfeldman, 2015/04/01 07:01:09]

Targets can be added later, you should keep the target observer. Also, note that
when the Page is a main target, the SW target can be added at a random moment
and will belong to the same origin. So you need to make sure you don't dupe
cache storages. Make sure to test it on the SW-controlled pages. It might be
that you only care about the first target in case of Cache Storage.

[dmurph, 2015/04/02 20:59:02]

I don't need to because we listen for securityOrigins on the model, which get
called when targets are added (unless I'm wrong).

The cache names are treated as a set, before the 'cache added' or 'removed'
events are sent out, so there shouldn't be duplicates.

+            var model = WebInspector.ServiceWorkerCacheModel.fromTarget(target);
+            var caches = model.caches();
+            for (var cache of caches)
+                this._addCache(model, cache);
         }
         WebInspector.targetManager.addModelListener(WebInspector.ServiceWorkerCacheModel, WebInspector.ServiceWorkerCacheModel.EventTypes.CacheAdded, this._cacheAdded, this);
         WebInspector.targetManager.addModelListener(WebInspector.ServiceWorkerCacheModel, WebInspector.ServiceWorkerCacheModel.EventTypes.CacheRemoved, this._cacheRemoved, this);
-        this._refreshCaches();
-        WebInspector.targetManager.observeTargets(this);
     },
 
     onattach: function()
@@ -1454,22 +1449,6 @@ WebInspector.ServiceWorkerCacheTreeElement.prototype = {
         this.listItemElement.addEventListener("contextmenu", this._handleContextMenuEvent.bind(this), true);
     },
 
-    /**
-     * @override
-     * @param {!WebInspector.Target} target
-     */
-    targetAdded: function(target)
-    {
-        if (target.isServiceWorker() && target.serviceWorkerCacheModel)
-            this._refreshCaches();
-    },
-
-    /**
-     * @override
-     * @param {!WebInspector.Target} target
-     */
-    targetRemoved: function(target) {},
-
     _handleContextMenuEvent: function(event)
     {
         var contextMenu = new WebInspector.ContextMenu(event);
@@ -1480,10 +1459,8 @@ WebInspector.ServiceWorkerCacheTreeElement.prototype = {
     _refreshCaches: function()
     {
         var targets = WebInspector.targetManager.targets();
-        for (var i = 0; i < targets.length; ++i) {
-            if (targets[i].serviceWorkerCacheModel)
-                targets[i].serviceWorkerCacheModel.refreshCacheNames();
-        }
+        for (var target of targets)
+            WebInspector.ServiceWorkerCacheModel.fromTarget(target).refreshCacheNames();
     },
 
     /**
@@ -1555,7 +1532,7 @@ WebInspector.ServiceWorkerCacheTreeElement.prototype = {
  */
 WebInspector.SWCacheTreeElement = function(storagePanel, model, cacheId)
 {
-    WebInspector.BaseStorageTreeElement.call(this, storagePanel, cacheId.name, ["service-worker-cache-tree-item"]);
+    WebInspector.BaseStorageTreeElement.call(this, storagePanel, cacheId.name + " - " + cacheId.securityOrigin, ["service-worker-cache-tree-item"]);
     this._model = model;
     this._cacheId = cacheId;
 }