tests(devtools): ensure device emulation is ready (#14431)

adamraine · web-flow · commit 78b93aacacb1 · 2022-10-07T15:00:20.000-07:00
diff --git a/core/scripts/pptr-run-devtools.js b/core/scripts/pptr-run-devtools.js
@@ -145,6 +145,10 @@ function addSniffer(receiver, methodName, override) {
 }
 
 async function waitForLighthouseReady() {
+  // Undocking later in the function can cause hiccups when Lighthouse enables device emulation.
+  // @ts-expect-error global
+  UI.dockController.setDockSide('undocked');
+
   // @ts-expect-error global
   const viewManager = UI.viewManager || (UI.ViewManager.ViewManager || UI.ViewManager).instance();
   const views = viewManager.views || viewManager._views;
@@ -156,9 +160,6 @@ async function waitForLighthouseReady() {
   const button = panel.contentElement.querySelector('button');
   if (button.disabled) throw new Error('Start button disabled');
 
-  // @ts-expect-error global
-  UI.dockController.setDockSide('undocked');
-
   // Give the main target model a moment to be available.
   // Otherwise, 'SDK.TargetManager.TargetManager.instance().mainTarget()' is null.
   // @ts-expect-error global
@@ -183,6 +184,13 @@ async function waitForLighthouseReady() {
       }
     }
   }
+
+  // Ensure the emulation model is ready before Lighthouse starts by enabling device emulation.
+  // @ts-expect-error global
+  const {deviceModeView} = Emulation.AdvancedApp.instance();
+  if (!deviceModeView.isDeviceModeOn()) {
+    deviceModeView.toggleDeviceMode();
+  }
 }
 
 async function runLighthouse() {
