2010-11-02 Pavel Feldman <pfeldman@chromium.org>
authorpfeldman@chromium.org <pfeldman@chromium.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Tue, 2 Nov 2010 19:00:41 +0000 (19:00 +0000)
committerpfeldman@chromium.org <pfeldman@chromium.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Tue, 2 Nov 2010 19:00:41 +0000 (19:00 +0000)
        Reviewed by Timothy Hatcher.

        Web Inspector: display frame names in the resources panel.
        https://bugs.webkit.org/show_bug.cgi?id=48839

        * inspector/Inspector.idl:
        * inspector/InspectorResourceAgent.cpp:
        (WebCore::frameId):
        (WebCore::buildObjectForDocumentLoader):
        (WebCore::buildObjectForFrame):
        (WebCore::buildObjectForFrameTree):
        (WebCore::InspectorResourceAgent::didCommitLoad):
        (WebCore::InspectorResourceAgent::frameDetachedFromParent):
        (WebCore::InspectorResourceAgent::frameForId):
        (WebCore::InspectorResourceAgent::resourceContent):
        * inspector/InspectorResourceAgent.h:
        * inspector/front-end/ResourceManager.js:
        (WebInspector.ResourceManager.prototype.didCommitLoadForFrame):
        (WebInspector.ResourceManager.prototype._processCachedResources):
        (WebInspector.ResourceManager.prototype._addFramesRecursively):
        (WebInspector.ResourceTreeModel.prototype.addOrUpdateFrame):
        (WebInspector.ResourceTreeModel.prototype.didCommitLoadForFrame):
        * inspector/front-end/StoragePanel.js:
        (WebInspector.StoragePanel.prototype.addOrUpdateFrame):
        (WebInspector.BaseStorageTreeElement.prototype.get titleText):
        (WebInspector.FrameTreeElement):
        (WebInspector.FrameTreeElement.prototype.onattach):
        (WebInspector.FrameTreeElement.prototype.get nameForSorting):
        (WebInspector.FrameTreeElement.prototype.setTitles):
        (WebInspector.FrameTreeElement.prototype.set hovered):
        * inspector/front-end/inspector.css:
        (li.selected .base-storage-tree-element-subtitle):
        (.base-storage-tree-element-subtitle):

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@71144 268f45cc-cd09-0410-ab3c-d52691b4dbfc

WebCore/ChangeLog
WebCore/inspector/Inspector.idl
WebCore/inspector/InspectorResourceAgent.cpp
WebCore/inspector/InspectorResourceAgent.h
WebCore/inspector/front-end/ResourceManager.js
WebCore/inspector/front-end/StoragePanel.js
WebCore/inspector/front-end/inspector.css

index 8a09865..a1656cc 100644 (file)
@@ -1,5 +1,41 @@
 2010-11-02  Pavel Feldman  <pfeldman@chromium.org>
 
+        Reviewed by Timothy Hatcher.
+
+        Web Inspector: display frame names in the resources panel.
+        https://bugs.webkit.org/show_bug.cgi?id=48839
+
+        * inspector/Inspector.idl:
+        * inspector/InspectorResourceAgent.cpp:
+        (WebCore::frameId):
+        (WebCore::buildObjectForDocumentLoader):
+        (WebCore::buildObjectForFrame):
+        (WebCore::buildObjectForFrameTree):
+        (WebCore::InspectorResourceAgent::didCommitLoad):
+        (WebCore::InspectorResourceAgent::frameDetachedFromParent):
+        (WebCore::InspectorResourceAgent::frameForId):
+        (WebCore::InspectorResourceAgent::resourceContent):
+        * inspector/InspectorResourceAgent.h:
+        * inspector/front-end/ResourceManager.js:
+        (WebInspector.ResourceManager.prototype.didCommitLoadForFrame):
+        (WebInspector.ResourceManager.prototype._processCachedResources):
+        (WebInspector.ResourceManager.prototype._addFramesRecursively):
+        (WebInspector.ResourceTreeModel.prototype.addOrUpdateFrame):
+        (WebInspector.ResourceTreeModel.prototype.didCommitLoadForFrame):
+        * inspector/front-end/StoragePanel.js:
+        (WebInspector.StoragePanel.prototype.addOrUpdateFrame):
+        (WebInspector.BaseStorageTreeElement.prototype.get titleText):
+        (WebInspector.FrameTreeElement):
+        (WebInspector.FrameTreeElement.prototype.onattach):
+        (WebInspector.FrameTreeElement.prototype.get nameForSorting):
+        (WebInspector.FrameTreeElement.prototype.setTitles):
+        (WebInspector.FrameTreeElement.prototype.set hovered):
+        * inspector/front-end/inspector.css:
+        (li.selected .base-storage-tree-element-subtitle):
+        (.base-storage-tree-element-subtitle):
+
+2010-11-02  Pavel Feldman  <pfeldman@chromium.org>
+
         Not reviewed. Follow up to r71139: removing unused images.
         https://bugs.webkit.org/show_bug.cgi?id=48827
 
index 1f4c78c..11d9a01 100644 (file)
@@ -114,7 +114,7 @@ module core {
         [notify] void didFailLoading(out long identifier, out double time, out String localizedDescription);
         [notify] void didLoadResourceFromMemoryCache(out double time, out Object resource);
         [notify] void setOverrideContent(out long identifier, out String sourceString, out String type);
-        [notify] void didCommitLoadForFrame(out unsigned long parentFrameId, out Object loader);
+        [notify] void didCommitLoadForFrame(out Object frame, out Object loader);
         [notify] void frameDetachedFromParent(out unsigned long frameId);
 
         [notify] void didCreateWebSocket(out unsigned long identifier, out String requestURL);
index ec70b8b..31be0c3 100644 (file)
@@ -39,6 +39,8 @@
 #include "DocumentLoader.h"
 #include "Frame.h"
 #include "FrameLoader.h"
+#include "HTMLFrameOwnerElement.h"
+#include "HTMLNames.h"
 #include "HTTPHeaderMap.h"
 #include "InspectorFrontend.h"
 #include "InspectorValues.h"
@@ -200,10 +202,15 @@ static PassRefPtr<InspectorObject> buildObjectForResourceResponse(const Resource
     return responseObject;
 }
 
+static unsigned long frameId(Frame* frame)
+{
+    return reinterpret_cast<uintptr_t>(frame);
+}
+
 static PassRefPtr<InspectorObject> buildObjectForDocumentLoader(DocumentLoader* loader)
 {
     RefPtr<InspectorObject> documentLoaderObject = InspectorObject::create();
-    documentLoaderObject->setNumber("frameId", reinterpret_cast<uintptr_t>(loader->frame()));
+    documentLoaderObject->setNumber("frameId", frameId(loader->frame()));
     documentLoaderObject->setNumber("loaderId", reinterpret_cast<uintptr_t>(loader));
     documentLoaderObject->setString("url", loader->requestURL().string());
     return documentLoaderObject;
@@ -340,11 +347,25 @@ void InspectorResourceAgent::setOverrideContent(unsigned long identifier, const
     m_frontend->setOverrideContent(identifier, sourceString, type);
 }
 
-static PassRefPtr<InspectorObject> buildObjectForFrameTree(Frame* frame, bool dumpResources)
+static PassRefPtr<InspectorObject> buildObjectForFrame(Frame* frame)
 {
     RefPtr<InspectorObject> frameObject = InspectorObject::create();
-    frameObject->setNumber("parentId", reinterpret_cast<uintptr_t>(frame->tree()->parent()));
-    frameObject->setNumber("id", reinterpret_cast<uintptr_t>(frame));
+    frameObject->setNumber("id", frameId(frame));
+    frameObject->setNumber("parentId", frameId(frame->tree()->parent()));
+    if (frame->ownerElement()) {\r
+        String name = frame->ownerElement()->getAttribute(HTMLNames::nameAttr);\r
+        if (name.isEmpty())\r
+            name = frame->ownerElement()->getAttribute(HTMLNames::idAttr);\r
+        frameObject->setString("name", name);
+    }
+    frameObject->setString("url", frame->loader()->url().string());
+    return frameObject;
+}
+
+static PassRefPtr<InspectorObject> buildObjectForFrameTree(Frame* frame, bool dumpResources)
+{
+    RefPtr<InspectorObject> frameObject = buildObjectForFrame(frame);
+
     if (dumpResources)
         populateObjectWithFrameResources(frame, frameObject);
     RefPtr<InspectorArray> childrenArray;
@@ -360,13 +381,12 @@ static PassRefPtr<InspectorObject> buildObjectForFrameTree(Frame* frame, bool du
 
 void InspectorResourceAgent::didCommitLoad(DocumentLoader* loader)
 {
-    Frame* parentFrame = loader->frame()->tree()->parent();
-    m_frontend->didCommitLoadForFrame(reinterpret_cast<uintptr_t>(parentFrame), buildObjectForDocumentLoader(loader));
+    m_frontend->didCommitLoadForFrame(buildObjectForFrame(loader->frame()), buildObjectForDocumentLoader(loader));
 }
 
 void InspectorResourceAgent::frameDetachedFromParent(Frame* frame)
 {
-    m_frontend->frameDetachedFromParent(reinterpret_cast<uintptr_t>(frame));
+    m_frontend->frameDetachedFromParent(frameId(frame));
 }
 
 #if ENABLE(WEB_SOCKETS)
@@ -419,15 +439,25 @@ void InspectorResourceAgent::didCloseWebSocket(unsigned long identifier)
 }
 #endif // ENABLE(WEB_SOCKETS)
 
+Frame* InspectorResourceAgent::frameForId(unsigned long frameId)
+{
+    Frame* mainFrame = m_page->mainFrame();
+    for (Frame* frame = mainFrame; frame; frame = frame->tree()->traverseNext(mainFrame)) {
+        if (reinterpret_cast<uintptr_t>(frame) == frameId)
+            return frame;
+    }
+    return 0;
+}
+
 void InspectorResourceAgent::cachedResources(RefPtr<InspectorObject>* object)
 {
     *object = buildObjectForFrameTree(m_page->mainFrame(), true);
 }
 
-void InspectorResourceAgent::resourceContent(unsigned long frameId, const String& url, bool base64Encode, String* content)
+void InspectorResourceAgent::resourceContent(unsigned long id, const String& url, bool base64Encode, String* content)
 {
     for (Frame* frame = m_page->mainFrame(); frame; frame = frame->tree()->traverseNext(m_page->mainFrame())) {
-        if (reinterpret_cast<uintptr_t>(frame) != frameId)
+        if (frameId(frame) != id)
             continue;
         if (base64Encode)
             InspectorResourceAgent::resourceContentBase64(frame, KURL(ParsedURLString, url), content);
index f61071c..e3153bf 100644 (file)
@@ -96,6 +96,8 @@ public:
     void didCloseWebSocket(unsigned long identifier);
 #endif
 
+    Frame* frameForId(unsigned long);
+
     // Called from frontend 
     void cachedResources(RefPtr<InspectorObject>*);
     void resourceContent(unsigned long frameID, const String& url, bool base64Encode, String* content);
index 6580be5..f594d8b 100644 (file)
@@ -256,9 +256,9 @@ WebInspector.ResourceManager.prototype = {
         WebInspector.panels.network.refreshResource(resource);
     },
 
-    didCommitLoadForFrame: function(parentFrameId, loader)
+    didCommitLoadForFrame: function(frame, loader)
     {
-        this._resourceTreeModel.didCommitLoadForFrame(parentFrameId, loader);
+        this._resourceTreeModel.didCommitLoadForFrame(frame, loader);
     },
 
     frameDetachedFromParent: function(frameId)
@@ -314,12 +314,12 @@ WebInspector.ResourceManager.prototype = {
 
     _processCachedResources: function(mainFramePayload)
     {
-        var mainResource = this._addFramesRecursively(null, mainFramePayload);
+        var mainResource = this._addFramesRecursively(mainFramePayload);
         WebInspector.mainResource = mainResource;
         mainResource.isMainResource = true;
     },
 
-    _addFramesRecursively: function(parentFrameId, framePayload)
+    _addFramesRecursively: function(framePayload)
     {
         var frameResource = this._createResource(null, framePayload.resource.url, framePayload.resource.loader);
         this._updateResourceWithRequest(frameResource, framePayload.resource.request);
@@ -328,11 +328,11 @@ WebInspector.ResourceManager.prototype = {
         frameResource.finished = true;
         this._bindResourceURL(frameResource);
 
-        this._resourceTreeModel.addOrUpdateFrame(parentFrameId, framePayload.id, frameResource.displayName);
+        this._resourceTreeModel.addOrUpdateFrame(framePayload);
         this._resourceTreeModel.addResourceToFrame(framePayload.id, frameResource);
 
         for (var i = 0; framePayload.children && i < framePayload.children.length; ++i)
-            this._addFramesRecursively(framePayload.id, framePayload.children[i]);
+            this._addFramesRecursively(framePayload.children[i]);
 
         if (!framePayload.subresources)
             return;
@@ -481,29 +481,29 @@ WebInspector.ResourceTreeModel = function()
 }
 
 WebInspector.ResourceTreeModel.prototype = {
-    addOrUpdateFrame: function(parentFrameId, frameId, displayName)
+    addOrUpdateFrame: function(frame)
     {
-        WebInspector.panels.storage.addOrUpdateFrame(parentFrameId, frameId, displayName);
-        var subframes = this._subframes[parentFrameId];
+        var tmpResource = new WebInspector.Resource(null, frame.url);
+        WebInspector.panels.storage.addOrUpdateFrame(frame.parentId, frame.id, frame.name, tmpResource.displayName);
+        var subframes = this._subframes[frame.parentId];
         if (!subframes) {
             subframes = {};
-            this._subframes[parentFrameId || 0] = subframes;
+            this._subframes[frame.parentId || 0] = subframes;
         }
-        subframes[frameId] = true;
+        subframes[frame.id] = true;
     },
 
-    didCommitLoadForFrame: function(parentFrameId, loader)
+    didCommitLoadForFrame: function(frame, loader)
     {
-        // parentFrameId === 0 is when main frame navigation happens.
-        this._clearChildFramesAndResources(parentFrameId ? loader.frameId : 0, loader.loaderId);
+        // frame.parentId === 0 is when main frame navigation happens.
+        this._clearChildFramesAndResources(frame.parentId ? frame.id : 0, loader.loaderId);
 
-        var tmpResource = new WebInspector.Resource(null, loader.url);
-        this.addOrUpdateFrame(parentFrameId, loader.frameId, tmpResource.displayName);
+        this.addOrUpdateFrame(frame);
 
-        var resourcesForFrame = this._resourcesByFrameId[loader.frameId];
+        var resourcesForFrame = this._resourcesByFrameId[frame.id];
         for (var i = 0; resourcesForFrame && i < resourcesForFrame.length; ++i) {
             WebInspector.resourceManager._bindResourceURL(resourcesForFrame[i]);
-            WebInspector.panels.storage.addResourceToFrame(loader.frameId, resourcesForFrame[i]);
+            WebInspector.panels.storage.addResourceToFrame(frame.id, resourcesForFrame[i]);
         }
     },
 
index f3d4e6e..dd6c818 100644 (file)
@@ -168,11 +168,11 @@ WebInspector.StoragePanel.prototype = {
             this.sidebarTree.selectedTreeElement.deselect();
     },
 
-    addOrUpdateFrame: function(parentFrameId, frameId, displayName)
+    addOrUpdateFrame: function(parentFrameId, frameId, title, subtitle)
     {
         var frameTreeElement = this._treeElementForFrameId[frameId];
         if (frameTreeElement) {
-            frameTreeElement.displayName = displayName;
+            frameTreeElement.setTitles(title, subtitle);
             return;
         }
 
@@ -182,7 +182,7 @@ WebInspector.StoragePanel.prototype = {
             return;
         }
 
-        var frameTreeElement = new WebInspector.FrameTreeElement(this, frameId, displayName);
+        var frameTreeElement = new WebInspector.FrameTreeElement(this, frameId, title, subtitle);
         this._treeElementForFrameId[frameId] = frameTreeElement;
 
         // Insert in the alphabetical order, first frames, then resources.
@@ -193,7 +193,7 @@ WebInspector.StoragePanel.prototype = {
                 parentTreeElement.insertChild(frameTreeElement, i);
                 return;
             }
-            if (child.displayName.localeCompare(frameTreeElement.displayName) > 0) {
+            if (child.nameForSorting.localeCompare(frameTreeElement.nameForSorting) > 0) {
                 parentTreeElement.insertChild(frameTreeElement, i);
                 return;
             }
@@ -790,6 +790,11 @@ WebInspector.BaseStorageTreeElement.prototype = {
             this.listItemElement.scrollIntoViewIfNeeded(false);
     },
 
+    get titleText()
+    {
+        return this._titleText;
+    },
+
     set titleText(titleText)
     {
         this._titleText = titleText;
@@ -848,11 +853,11 @@ WebInspector.StorageCategoryTreeElement.prototype = {
 }
 WebInspector.StorageCategoryTreeElement.prototype.__proto__ = WebInspector.BaseStorageTreeElement.prototype;
 
-WebInspector.FrameTreeElement = function(storagePanel, frameId, displayName)
+WebInspector.FrameTreeElement = function(storagePanel, frameId, title, subtitle)
 {
-    WebInspector.BaseStorageTreeElement.call(this, storagePanel, null, displayName, "frame-storage-tree-item");
+    WebInspector.BaseStorageTreeElement.call(this, storagePanel, null, "", "frame-storage-tree-item");
     this._frameId = frameId;
-    this._displayName = displayName;
+    this.setTitles(title, subtitle);
 }
 
 WebInspector.FrameTreeElement.prototype = {
@@ -861,6 +866,16 @@ WebInspector.FrameTreeElement.prototype = {
         return "frame://" + encodeURI(this._displayName);
     },
 
+    onattach: function()
+    {
+        WebInspector.BaseStorageTreeElement.prototype.onattach.call(this);
+        if (this._titleToSetOnAttach || this._subtitleToSetOnAttach) {
+            this.setTitles(this._titleToSetOnAttach, this._subtitleToSetOnAttach);
+            delete this._titleToSetOnAttach;
+            delete this._subtitleToSetOnAttach;
+        }
+    },
+
     onselect: function()
     {
         WebInspector.BaseStorageTreeElement.prototype.onselect.call(this);
@@ -870,15 +885,27 @@ WebInspector.FrameTreeElement.prototype = {
         InspectorBackend.hideFrameHighlight();
     },
 
-    get displayName()
+    get nameForSorting()
     {
-        return this._displayName;
+        return this._nameForSorting;
     },
 
-    set displayName(displayName)
+    setTitles: function(title, subtitle)
     {
-        this._displayName = displayName;
-        this.titleText = displayName;
+        this._nameForSorting = (title ? title : "") + (subtitle ? subtitle : "");
+        if (this.parent) {
+            if (title)
+                this.titleElement.textContent = title;
+            if (subtitle) {
+                var subtitleElement = document.createElement("span");
+                subtitleElement.className = "base-storage-tree-element-subtitle";
+                subtitleElement.textContent = "(" + subtitle + ")";
+                this.titleElement.appendChild(subtitleElement);
+            }
+        } else {
+            this._titleToSetOnAttach = title;
+            this._subtitleToSetOnAttach = subtitle;
+        }
     },
 
     set hovered(hovered)
index e47a37f..eac119f 100644 (file)
@@ -1978,6 +1978,16 @@ body.inactive .storage.panel .sidebar li.selected .selection {
     top: 1px;
 }
 
+li.selected .base-storage-tree-element-subtitle {
+    color: white;
+}
+
+.base-storage-tree-element-subtitle {
+    padding-left: 2px;
+    color: rgb(80, 80, 80);
+    text-shadow: none;
+}
+
 .storage.panel .status {
     float: right;
     height: 16px;