Bug 1702511 - [devtools] Expose isNavigationRequest on NETWORK_EVENT to highlight request done for top level document navigation. r=jdescottes,nchevobbe,bomsy

Differential Revision: https://phabricator.services.mozilla.com/D112921

devtools/server/actors/network-monitor/network-event-actor.js

@@ -90,6 +90,7 @@ const NetworkEventActor = protocol.ActorClassWithSpec(networkEventSpec, {
 
     this._truncated = false;
     this._private = networkEvent.private;
+    this._isNavigationRequest = networkEvent.isNavigationRequest;
   },
 
   /**
@@ -131,6 +132,7 @@ const NetworkEventActor = protocol.ActorClassWithSpec(networkEventSpec, {
       // For websocket requests the serial is used instead of the channel id.
       stacktraceResourceId:
         this._cause.type == "websocket" ? this._serial : this._channelId,
+      isNavigationRequest: this._isNavigationRequest,
     };
   },
 

devtools/server/actors/network-monitor/utils/network-utils.js

@@ -781,6 +781,12 @@ exports.createNetworkEvent = function(
     }
   }
 
+  // isNavigationRequest is true for the one request used to load a new top level document
+  // of a given tab, or top level window. It will typically be false for navigation requests
+  // of iframes, i.e. the request loading another document in an iframe.
+  event.isNavigationRequest =
+    channel.isMainDocumentChannel && channel.loadInfo.isTopLevelLoad;
+
   return event;
 };
 

devtools/shared/commands/resource/tests/browser_resources_network_events.js

@@ -30,10 +30,12 @@ async function testNetworkEventResourcesWithExistingResources() {
       [`${EXAMPLE_DOMAIN}cached_post.html`]: {
         resourceType: ResourceCommand.TYPES.NETWORK_EVENT,
         method: "POST",
+        isNavigationRequest: false,
       },
       [`${EXAMPLE_DOMAIN}live_get.html`]: {
         resourceType: ResourceCommand.TYPES.NETWORK_EVENT,
         method: "GET",
+        isNavigationRequest: false,
       },
     },
     expectedResourcesOnUpdated: {
@@ -57,6 +59,7 @@ async function testNetworkEventResourcesWithoutExistingResources() {
       [`${EXAMPLE_DOMAIN}live_get.html`]: {
         resourceType: ResourceCommand.TYPES.NETWORK_EVENT,
         method: "GET",
+        isNavigationRequest: false,
       },
     },
     expectedResourcesOnUpdated: {
@@ -145,11 +148,7 @@ async function testNetworkEventResources(options) {
         resourceCommand.TYPES.NETWORK_EVENT,
         "Received a network event resource"
       );
-      actualResourcesOnAvailable[resource.url] = {
-        resourceId: resource.resourceId,
-        resourceType: resource.resourceType,
-        method: resource.method,
-      };
+      actualResourcesOnAvailable[resource.url] = resource;
       totalExpectedOnAvailableCounts--;
     }
   };
@@ -161,11 +160,7 @@ async function testNetworkEventResources(options) {
         resourceCommand.TYPES.NETWORK_EVENT,
         "Received a network update event resource"
       );
-      actualResourcesOnUpdated[resource.url] = {
-        resourceId: resource.resourceId,
-        resourceType: resource.resourceType,
-        method: resource.method,
-      };
+      actualResourcesOnUpdated[resource.url] = resource;
       totalExpectedOnUpdatedCounts--;
     }
   };
@@ -305,6 +300,21 @@ async function testNetworkEventResourcesFromTheContentProcess() {
     "Got three network events fired on update"
   );
 
+  // Find the page's request
+  const availablePageResource = allResourcesOnAvailable.find(
+    resource => resource.url === CSP_URL
+  );
+  is(
+    availablePageResource.resourceType,
+    resourceCommand.TYPES.NETWORK_EVENT,
+    "This is a network event resource"
+  );
+  is(
+    availablePageResource.isNavigationRequest,
+    true,
+    "The page request is correctly flaged as a navigation request"
+  );
+
   // Find the Blocked CSP JS resource
   const availableJSResource = allResourcesOnAvailable.find(
     resource => resource.url === JS_CSP_URL
@@ -388,6 +398,13 @@ function assertResources(actual, expected) {
     "The resource type is correct"
   );
   is(actual.method, expected.method, "The method is correct");
+  if ("isNavigationRequest" in expected) {
+    is(
+      actual.isNavigationRequest,
+      expected.isNavigationRequest,
+      "The isNavigationRequest attribute is correct"
+    );
+  }
 }
 
 const cachedRequest = `await fetch("/cached_post.html", { method: "POST" });`;