Bug 1691836 - [devtools] Wait for the initialization of markupview in inspector open() r=nchevobbe
authorJulian Descottes <jdescottes@mozilla.com>
Wed, 10 Feb 2021 14:45:17 +0000
changeset 566816 6d7ff75c6ab86b820e6f1c464a163b43cac5197a
parent 566815 755768512c278b3107678a033589fe110e58e7fa
child 566817 20982512637917c0a73129f8eb99cafbadff9901
push id38191
push userbtara@mozilla.com
push dateThu, 11 Feb 2021 05:02:45 +0000
treeherdermozilla-central@5cbcb80f72bd [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersnchevobbe
bugs1691836
milestone87.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1691836 - [devtools] Wait for the initialization of markupview in inspector open() r=nchevobbe We used to only wait until the markup view document was loaded, via the markuploaded event. This lead tests to wait for additional events to make sure the inspector markup view could be interacted with. Here we wait for a new dedicated internal promise instead of an event. This promise is only resolved once the inspector has initialized the markup view. Test helpers are updated to stop listening for additional events. Differential Revision: https://phabricator.services.mozilla.com/D104649
devtools/client/inspector/inspector.js
devtools/client/inspector/test/shared-head.js
--- a/devtools/client/inspector/inspector.js
+++ b/devtools/client/inspector/inspector.js
@@ -193,20 +193,22 @@ Inspector.prototype = {
    */
   async init() {
     // Localize all the nodes containing a data-localization attribute.
     localizeMarkup(this.panelDoc);
 
     this._fluentL10n = new FluentL10n();
     await this._fluentL10n.init(["devtools/client/compatibility.ftl"]);
 
-    // The markup view will be initialized in onRootNodeAvailable, which will be
-    // called through watchTargets and _onTargetAvailable, when a root node is
-    // available for the top-level target.
-    this._onFirstMarkupLoaded = this.once("markuploaded");
+    // This promise should be resolved once the markupview frame has been loaded
+    // and the inspector has fully initialized it (for instance expanding the
+    // initially selected node).
+    this._onMarkupViewInitialized = new Promise(
+      r => (this._resolveMarkupViewInitialized = r)
+    );
 
     // If the server-side stylesheet watcher is enabled, we should start to watch
     // stylesheet resources before instanciating the inspector front since pageStyle
     // actor should refer the watcher.
     if (
       this.toolbox.resourceWatcher.hasResourceWatcherSupport(
         this.toolbox.resourceWatcher.TYPES.STYLESHEET
       )
@@ -391,17 +393,17 @@ Inspector.prototype = {
     // the splitter set the right and left panel sizes, in order to avoid resizing it
     // during load of the inspector.
     this.panelDoc.getElementById("inspector-main-content").style.visibility =
       "visible";
 
     // Setup the sidebar panels.
     this.setupSidebar();
 
-    await this._onFirstMarkupLoaded;
+    await this._onMarkupViewInitialized;
     this.isReady = true;
 
     // All the components are initialized. Take care of the remaining initialization
     // and setup.
     this.breadcrumbs = new HTMLBreadcrumbs(this);
     this.setupExtensionSidebars();
     this.setupSearchBox();
 
@@ -1387,16 +1389,24 @@ Inspector.prototype = {
       if (this.toolbox && this.toolbox.currentToolId == "inspector") {
         const delay = this.panelWin.performance.now() - this._newRootStart;
         const telemetryKey = "DEVTOOLS_INSPECTOR_NEW_ROOT_TO_RELOAD_DELAY_MS";
         const histogram = this.telemetry.getHistogramById(telemetryKey);
         histogram.add(delay);
       }
       delete this._newRootStart;
     }
+
+    // The initial inspector open() waits for the markup view to be initialized
+    // via the _onMarkupViewInitialized promise. Resolve it now.
+    if (this._resolveMarkupViewInitialized) {
+      this._resolveMarkupViewInitialized();
+      // Should only be done for the first load, remove the `resolve` method.
+      delete this._resolveMarkupViewInitialized;
+    }
   },
 
   _selectionCssSelectors: null,
 
   /**
    * Set the array of CSS selectors for the currently selected node.
    * We use an array of selectors in case the element is in iframes.
    * Will store the current target url along with it to allow pre-selection at
--- a/devtools/client/inspector/test/shared-head.js
+++ b/devtools/client/inspector/test/shared-head.js
@@ -25,21 +25,16 @@ var openInspector = async function(hostT
 
   const toolbox = await openToolboxForTab(
     gBrowser.selectedTab,
     "inspector",
     hostType
   );
   const inspector = toolbox.getPanel("inspector");
 
-  if (inspector._updateProgress) {
-    info("Need to wait for the inspector to update");
-    await inspector.once("inspector-updated");
-  }
-
   const testActor = await getTestActor(toolbox);
 
   return { toolbox, inspector, testActor };
 };
 
 /**
  * Open the toolbox, with the inspector tool visible, and the one of the sidebar
  * tabs selected.