Bug 1620280 - [devtools] Convert SourceMapService to use SOURCE resource. r=nchevobbe,jdescottes

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

devtools/client/framework/source-map-url-service.js

@@ -31,12 +31,11 @@ class SourceMapURLService {
     this._runningCallback = false;
 
     this._syncPrevValue = this._syncPrevValue.bind(this);
-    this._onSourceUpdatedEvent = this._onSourceUpdatedEvent.bind(this);
     this._clearAllState = this._clearAllState.bind(this);
     this._onNewStyleSheet = this._onNewStyleSheet.bind(this);
 
     this._target.on("will-navigate", this._clearAllState);
-    this._target.on("source-updated", this._onSourceUpdatedEvent);
+
     Services.prefs.addObserver(SOURCE_MAP_PREF, this._syncPrevValue);
   }
 
@@ -47,7 +46,6 @@ class SourceMapURLService {
   destroy() {
     this._clearAllState();
     this._target.off("will-navigate", this._clearAllState);
-    this._target.off("source-updated", this._onSourceUpdatedEvent);
     Services.prefs.removeObserver(SOURCE_MAP_PREF, this._syncPrevValue);
   }
 
@@ -204,9 +202,10 @@ class SourceMapURLService {
     this._pendingURLSubscriptions.clear();
     this._urlToIDMap.clear();
 
+    const { resourceWatcher } = this._toolbox;
     try {
-      this._toolbox.resourceWatcher.unwatchResources(
-        [this._toolbox.resourceWatcher.TYPES.STYLESHEET],
+      resourceWatcher.unwatchResources(
+        [resourceWatcher.TYPES.STYLESHEET, resourceWatcher.TYPES.SOURCE],
         { onAvailable: this._onResourceAvailable }
       );
     } catch (e) {
@@ -217,10 +216,6 @@ class SourceMapURLService {
     this._sourcesLoading = null;
   }
 
-  _onSourceUpdatedEvent(sourceEvent) {
-    this._onNewJavascript(sourceEvent.source);
-  }
-
   _onNewJavascript(source) {
     const { url, actor: id, sourceMapBaseURL, sourceMapURL } = source;
 
@@ -428,42 +423,24 @@ class SourceMapURLService {
           return;
         }
 
-        this._onResourceAvailable = async resources => {
+        const { resourceWatcher } = this._toolbox;
+        const { STYLESHEET, SOURCE } = resourceWatcher.TYPES;
+
+        this._onResourceAvailable = resources => {
           if (this._sourcesLoading === sourcesLoading) {
             for (const resource of resources) {
-              this._onNewStyleSheet(resource);
+              if (resource.resourceType == STYLESHEET) {
+                this._onNewStyleSheet(resource);
+              } else if (resource.resourceType == SOURCE) {
+                this._onNewJavascript(resource);
+              }
             }
           }
         };
 
-        await Promise.all([
-          this._toolbox.resourceWatcher.watchResources(
-            [this._toolbox.resourceWatcher.TYPES.STYLESHEET],
-            { onAvailable: this._onResourceAvailable }
-          ),
-          (async () => {
-            const { threadFront } = this._toolbox;
-            if (!threadFront) {
-              console.warn(
-                "sourcemap url service cannot query for sources, no threadFront found"
-              );
-              return;
-            }
-
-            try {
-              const { sources } = await threadFront.getSources();
-              if (this._sourcesLoading === sourcesLoading) {
-                // If we've cleared the state since starting this request,
-                // we don't want to populate these.
-                for (const source of sources) {
-                  this._onNewJavascript(source);
-                }
-              }
-            } catch (err) {
-              // Also ignore any protocol-based errors.
-            }
-          })(),
-        ]);
+        await resourceWatcher.watchResources([STYLESHEET, SOURCE], {
+          onAvailable: this._onResourceAvailable,
+        });
       })();
       this._sourcesLoading = sourcesLoading;
     }
@@ -471,6 +448,13 @@ class SourceMapURLService {
     return this._sourcesLoading;
   }
 
+  waitForSourcesLoading() {
+    if (this._sourcesLoading) {
+      return this._sourcesLoading;
+    }
+    return Promise.resolve();
+  }
+
   _convertPendingURLSubscriptionsToID(url, id) {
     const urlSubscriptions = this._pendingURLSubscriptions.get(url);
     if (!urlSubscriptions) {

devtools/client/framework/test/head.js

@@ -119,16 +119,21 @@ function createScript(url) {
 function waitForSourceLoad(toolbox, url) {
   info(`Waiting for source ${url} to be available...`);
   return new Promise(resolve => {
-    const target = toolbox.target;
+    const { resourceWatcher } = toolbox;
 
-    function sourceHandler(sourceEvent) {
-      if (sourceEvent && sourceEvent.source && sourceEvent.source.url === url) {
-        resolve();
-        target.off("source-updated", sourceHandler);
+    function onAvailable(sources) {
+      for (const source of sources) {
+        if (source.url === url) {
+          resourceWatcher.unwatchResources([resourceWatcher.TYPES.SOURCE], {
+            onAvailable,
+          });
+          resolve();
+        }
       }
     }
-
-    target.on("source-updated", sourceHandler);
+    resourceWatcher.watchResources([resourceWatcher.TYPES.SOURCE], {
+      onAvailable,
+    });
   });
 }
 

devtools/client/framework/toolbox.js

@@ -3586,11 +3586,6 @@ Toolbox.prototype = {
     this._lastFocusedElement = null;
     this._pausedThreads = null;
 
-    if (this._sourceMapURLService) {
-      this._sourceMapURLService.destroy();
-      this._sourceMapURLService = null;
-    }
-
     if (this._sourceMapService) {
       this._sourceMapService.stopSourceMapWorker();
       this._sourceMapService = null;
@@ -3695,6 +3690,12 @@ Toolbox.prototype = {
               this._netMonitorAPI = null;
             }
 
+            if (this._sourceMapURLService) {
+              await this._sourceMapURLService.waitForSourcesLoading();
+              this._sourceMapURLService.destroy();
+              this._sourceMapURLService = null;
+            }
+
             this._removeWindowListeners();
             this._removeChromeEventHandlerEvents();
 

devtools/client/fronts/targets/target-mixin.js

@@ -42,7 +42,6 @@ function TargetMixin(parentClass) {
       this._forceChrome = false;
 
       this.destroy = this.destroy.bind(this);
-      this._onNewSource = this._onNewSource.bind(this);
 
       this.threadFront = null;
 
@@ -587,16 +586,9 @@ function TargetMixin(parentClass) {
 
       await this.threadFront.attach(options);
 
-      this.threadFront.on("newSource", this._onNewSource);
-
       return this.threadFront;
     }
 
-    // Listener for "newSource" event fired by the thread actor
-    _onNewSource(packet) {
-      this.emit("source-updated", packet);
-    }
-
     /**
      * Setup listeners for remote debugging, updating existing ones as necessary.
      */
@@ -616,11 +608,6 @@ function TargetMixin(parentClass) {
       }
       this.off("tabDetached", this.destroy);
 
-      // Remove listeners set in attachThread
-      if (this.threadFront) {
-        this.threadFront.off("newSource", this._onNewSource);
-      }
-
       // Remove listeners set in attachConsole
       if (this.removeOnInspectObjectListener) {
         this.removeOnInspectObjectListener();

devtools/client/webconsole/test/browser/browser_webconsole_warning_group_cookies.js

@@ -144,6 +144,11 @@ add_task(async function testInvalidSameSiteMessage() {
     `| ${message2}`,
   ]);
 
+  // Source map are being resolved in background and we might have
+  // pending request related to this service if we close the window
+  // immeditely. So just wait for these request to finish before proceeding.
+  await hud.toolbox.sourceMapURLService.waitForSourcesLoading();
+
   await win.close();
 });
 

devtools/shared/protocol/Front.js

@@ -144,7 +144,10 @@ class Front extends Pool {
     }
 
     // Call listeners registered via `watchFronts` method
-    this._frontCreationListeners.emit(front.typeName, front);
+    // (ignore if this front has been destroyed)
+    if (this._frontCreationListeners) {
+      this._frontCreationListeners.emit(front.typeName, front);
+    }
   }
 
   async unmanage(front) {