ServiceWorker Inspector: Frontend changes to support Network tab and sub resources Network Tab: - Should show requests made by the ServiceWorker Resource Tab: (UI like a Dedicated Worker) - Should show sub-resources loaded by the ServiceWorker - Should categorize the sub-resources underneath the ServiceWorker component
<rdar://problem/35517704>
Created attachment 327258 [details] [PATCH] Proposed Fix There are a few things I want to address in follow-ups: 1. Image resources added via CacheStorage.prototype.add / fetch() don't show up properly - this is essentially pre-existing bad behavior for fetching any binary content 2. Metrics data is not included - this requires enabling ResourceTiming in ServiceWorkers, which I'll be looking into
Created attachment 327259 [details] [IMAGE] Resources Tab
Created attachment 327260 [details] [IMAGE] Network Tab - Table
Created attachment 327261 [details] [IMAGE] Network Tab - Detail
Note that the ResponseSource is an emdash right now, that is related to the other metrics that will be enabled with ResourceTiming.
Comment on attachment 327258 [details] [PATCH] Proposed Fix Attachment 327258 [details] did not pass mac-ews (mac): Output: http://webkit-queues.webkit.org/results/5282736 New failing tests: http/tests/inspector/network/resource-metrics.html http/tests/inspector/network/fetch-response-body.html http/tests/inspector/network/set-resource-caching-disabled-disk-cache.html http/tests/inspector/network/resource-timing.html http/tests/inspector/network/resource-response-source-network.html http/tests/inspector/network/fetch-network-data.html inspector/worker/resources-in-worker.html inspector/network/xhr-json-blob-has-content.html http/tests/inspector/network/resource-response-source-memory-cache.html http/tests/inspector/network/xhr-request-data-encoded-correctly.html inspector/dom-debugger/xhr-breakpoints.html http/tests/inspector/network/set-resource-caching-disabled-memory-cache.html http/tests/inspector/network/copy-as-curl.html inspector/debugger/breakpoints/resolved-dump-all-pause-locations.html http/tests/inspector/network/xhr-response-body.html inspector/unit-tests/target-manager.html http/tests/inspector/network/resource-response-source-memory-cache-revalidate-expired-only.html http/tests/inspector/network/resource-mime-type.html inspector/model/script-resource-relationship.html
Created attachment 327274 [details] Archive of layout-test-results from ews100 for mac-elcapitan The attached test failures were seen while running run-webkit-tests on the mac-ews. Bot: ews100 Port: mac-elcapitan Platform: Mac OS X 10.11.6
Comment on attachment 327258 [details] [PATCH] Proposed Fix Attachment 327258 [details] did not pass mac-debug-ews (mac): Output: http://webkit-queues.webkit.org/results/5283058 New failing tests: http/tests/inspector/network/resource-metrics.html inspector/unit-tests/target-manager.html http/tests/inspector/network/fetch-response-body.html http/tests/inspector/network/set-resource-caching-disabled-disk-cache.html http/tests/inspector/network/resource-timing.html http/tests/inspector/network/resource-response-source-network.html http/tests/inspector/network/fetch-network-data.html http/tests/inspector/network/set-resource-caching-disabled-memory-cache.html inspector/model/script-resource-relationship.html http/tests/inspector/network/xhr-request-data-encoded-correctly.html http/tests/inspector/network/copy-as-curl.html inspector/network/xhr-json-blob-has-content.html http/tests/inspector/network/resource-mime-type.html http/tests/inspector/network/xhr-response-body.html http/tests/inspector/network/resource-response-source-memory-cache.html http/tests/inspector/network/resource-response-source-memory-cache-revalidate-expired-only.html inspector/dom-debugger/xhr-breakpoints.html
Created attachment 327282 [details] Archive of layout-test-results from ews114 for mac-elcapitan The attached test failures were seen while running run-webkit-tests on the mac-debug-ews. Bot: ews114 Port: mac-elcapitan Platform: Mac OS X 10.11.6
Comment on attachment 327258 [details] [PATCH] Proposed Fix Attachment 327258 [details] did not pass mac-wk2-ews (mac-wk2): Output: http://webkit-queues.webkit.org/results/5283949 New failing tests: http/tests/inspector/network/resource-metrics.html http/tests/inspector/network/resource-response-service-worker.html http/tests/inspector/network/fetch-response-body.html http/tests/inspector/network/set-resource-caching-disabled-disk-cache.html http/tests/inspector/network/set-resource-caching-disabled-memory-cache.html inspector/unit-tests/target-manager.html http/tests/inspector/network/resource-mime-type.html http/tests/inspector/network/resource-sizes-disk-cache.html http/tests/inspector/network/resource-timing.html http/tests/inspector/network/resource-response-source-memory-cache.html http/tests/inspector/network/copy-as-curl.html http/tests/inspector/network/xhr-response-body.html http/tests/inspector/network/resource-response-source-network.html inspector/worker/resources-in-worker.html inspector/network/xhr-json-blob-has-content.html inspector/model/script-resource-relationship.html http/tests/inspector/network/xhr-request-data-encoded-correctly.html inspector/debugger/breakpoints/resolved-dump-all-pause-locations.html http/tests/inspector/network/resource-response-source-memory-cache-revalidate-expired-only.html http/tests/inspector/network/fetch-network-data.html http/tests/inspector/network/resource-response-source-disk-cache.html http/tests/inspector/network/resource-sizes-network.html inspector/dom-debugger/xhr-breakpoints.html
Created attachment 327287 [details] Archive of layout-test-results from ews107 for mac-elcapitan-wk2 The attached test failures were seen while running run-webkit-tests on the mac-wk2-ews. Bot: ews107 Port: mac-elcapitan-wk2 Platform: Mac OS X 10.11.6
Created attachment 327713 [details] [PATCH] Proposed Fix I was missing `WI.pageTarget` in Test.js
Comment on attachment 327713 [details] [PATCH] Proposed Fix View in context: https://bugs.webkit.org/attachment.cgi?id=327713&action=review r=me > Source/WebInspectorUI/UserInterface/Controllers/FrameResourceManager.js:522 > + if (type === "Document" && frame.mainResource.url === url && frame.loaderIdentifier === loaderIdentifier) I'd prefer we move the enum somewhere else, rather than rely on bare string literals. Could it go on NetworkAgent? This can be a followup if it gets messy. > Source/WebInspectorUI/UserInterface/Controllers/FrameResourceManager.js:524 > + else if (type === "Document" && frame.provisionalMainResource && frame.provisionalMainResource.url === url && frame.provisionalLoaderIdentifier === loaderIdentifier) Ditto. > Source/WebInspectorUI/UserInterface/Controllers/FrameResourceManager.js:710 > + if (resourcePayload.type === "Document" && resourcePayload.url === payload.frame.url) Ditto. > Source/WebInspectorUI/UserInterface/Models/Resource.js:98 > + static preferredType(type, mimeType) This name is somewhat vague. > Source/WebInspectorUI/UserInterface/Protocol/Connection.js:275 > +InspectorBackend.MainConnection = class InspectorBackendMainConnection extends InspectorBackend.Connection OK > Source/WebInspectorUI/UserInterface/Views/NetworkTableContentView.js:876 > + let populateTargetResources = (target) => { Nit: I would use Cocoa style naming, populateResourcesForFrame() populateResourcesForTarget()
Comment on attachment 327713 [details] [PATCH] Proposed Fix View in context: https://bugs.webkit.org/attachment.cgi?id=327713&action=review >> Source/WebInspectorUI/UserInterface/Controllers/FrameResourceManager.js:522 >> + if (type === "Document" && frame.mainResource.url === url && frame.loaderIdentifier === loaderIdentifier) > > I'd prefer we move the enum somewhere else, rather than rely on bare string literals. Could it go on NetworkAgent? This can be a followup if it gets messy. Yeah, we will want to move this to Network eventually. At this point Network should be considered the base and Page / ServiceWorker are disjoint and both would have a Network component. >> Source/WebInspectorUI/UserInterface/Models/Resource.js:98 >> + static preferredType(type, mimeType) > > This name is somewhat vague. Hmm, would bestType() or mostSpecificType() be better? This is something I'm going to be circling back to as I try to make an XHR/Fetch of an Image resource show properly. >> Source/WebInspectorUI/UserInterface/Views/NetworkTableContentView.js:876 >> + let populateTargetResources = (target) => { > > Nit: I would use Cocoa style naming, populateResourcesForFrame() populateResourcesForTarget() I like that suggestion.
<https://trac.webkit.org/r225244>