Bug 1625942: Introduce ResourceWatcher into network monitor to fetch DocumentEvents. r=ochameau

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

devtools/client/netmonitor/src/connector/firefox-connector.js

@@ -33,7 +33,6 @@ class FirefoxConnector {
     this.willNavigate = this.willNavigate.bind(this);
     this.navigate = this.navigate.bind(this);
     this.displayCachedEvents = this.displayCachedEvents.bind(this);
-    this.onDocEvent = this.onDocEvent.bind(this);
     this.sendHTTPRequest = this.sendHTTPRequest.bind(this);
     this.setPreferences = this.setPreferences.bind(this);
     this.triggerActivity = this.triggerActivity.bind(this);
@@ -47,6 +46,7 @@ class FirefoxConnector {
     this.getLongString = this.getLongString.bind(this);
     this.getNetworkRequest = this.getNetworkRequest.bind(this);
     this.onTargetAvailable = this.onTargetAvailable.bind(this);
+    this.onResourceAvailable = this.onResourceAvailable.bind(this);
   }
 
   get currentTarget() {
@@ -72,6 +72,11 @@ class FirefoxConnector {
       [this.toolbox.targetList.TYPES.FRAME],
       this.onTargetAvailable
     );
+
+    await this.toolbox.resourceWatcher.watch(
+      [this.toolbox.resourceWatcher.TYPES.DOCUMENT_EVENTS],
+      this.onResourceAvailable
+    );
   }
 
   disconnect() {
@@ -87,6 +92,11 @@ class FirefoxConnector {
       this.onTargetAvailable
     );
 
+    this.toolbox.resourceWatcher.unwatch(
+      [this.toolbox.resourceWatcher.TYPES.DOCUMENT_EVENTS],
+      this.onResourceAvailable
+    );
+
     if (this.actions) {
       this.actions.batchReset();
     }
@@ -145,13 +155,18 @@ class FirefoxConnector {
     }
   }
 
+  async onResourceAvailable({ resourceType, targetFront, resource }) {
+    if (resourceType === this.toolbox.resourceWatcher.TYPES.DOCUMENT_EVENTS) {
+      this.onDocEvent(resource);
+    }
+  }
+
   async addListeners() {
     this.webConsoleFront.on("networkEvent", this.dataProvider.onNetworkEvent);
     this.webConsoleFront.on(
       "networkEventUpdate",
       this.dataProvider.onNetworkEventUpdate
     );
-    this.webConsoleFront.on("documentEvent", this.onDocEvent);
 
     // Support for WebSocket monitoring is currently hidden behind this pref.
     if (Services.prefs.getBoolPref("devtools.netmonitor.features.webSockets")) {
@@ -174,10 +189,6 @@ class FirefoxConnector {
         // Support for FF68 or older
       }
     }
-
-    // The console actor supports listening to document events like
-    // DOMContentLoaded and load.
-    await this.webConsoleFront.startListeners(["DocumentEvents"]);
   }
 
   removeListeners() {
@@ -204,7 +215,6 @@ class FirefoxConnector {
         "networkEventUpdate",
         this.dataProvider.onNetworkEventUpdate
       );
-      this.webConsoleFront.off("docEvent", this.onDocEvent);
     }
   }
 

devtools/server/actors/webconsole/listeners/document-events.js

@@ -46,6 +46,14 @@ DocumentEventsListener.prototype = {
       return;
     }
 
+    const packet = {
+      from: this.console.actorID,
+      type: "documentEvent",
+      name: "dom-loading",
+      time: window.performance.timing.navigationStart,
+    };
+    this.console.conn.send(packet);
+
     const { readyState } = window.document;
     if (readyState != "interactive" && readyState != "complete") {
       window.addEventListener("DOMContentLoaded", this.onContentLoaded, {

devtools/shared/resources/resource-watcher.js

@@ -301,6 +301,7 @@ class ResourceWatcher {
 
 ResourceWatcher.TYPES = ResourceWatcher.prototype.TYPES = {
   CONSOLE_MESSAGES: "console-messages",
+  DOCUMENT_EVENTS: "document-events",
 };
 module.exports = { ResourceWatcher };
 
@@ -351,4 +352,20 @@ const LegacyListeners = {
     // Forward new message events
     webConsoleFront.on("consoleAPICall", onAvailable);
   },
+  async [ResourceWatcher.TYPES.DOCUMENT_EVENTS]({
+    targetList,
+    targetType,
+    targetFront,
+    isTopLevel,
+    onAvailable,
+  }) {
+    // DocumentEventsListener of webconsole handles only top level document.
+    if (!isTopLevel) {
+      return;
+    }
+
+    const webConsoleFront = await targetFront.getFront("console");
+    webConsoleFront.on("documentEvent", onAvailable);
+    await webConsoleFront.startListeners(["DocumentEvents"]);
+  },
 };