fix(trace-viewer): fall back to stable channels (#7429)

src/server/chromium/crPage.ts

@@ -34,7 +34,6 @@ import { CRCoverage } from './crCoverage';
 import { CRPDF } from './crPdf';
 import { CRBrowserContext } from './crBrowser';
 import * as types from '../types';
-import { ConsoleMessage } from '../console';
 import { rewriteErrorMessage } from '../../utils/stackTrace';
 import { assert, headersArrayToObject, createGuid, canAccessFile } from '../../utils/utils';
 import { VideoRecorder } from './videoRecorder';
@@ -785,7 +784,7 @@ class FrameSession {
   }
 
   _handleException(exceptionDetails: Protocol.Runtime.ExceptionDetails) {
-    this._page.emit(Page.Events.PageError, exceptionToError(exceptionDetails));
+    this._page.firePageError(exceptionToError(exceptionDetails));
   }
 
   async _onTargetCrashed() {
@@ -803,7 +802,7 @@ class FrameSession {
         lineNumber: lineNumber || 0,
         columnNumber: 0,
       };
-      this._page.emit(Page.Events.Console, new ConsoleMessage(this._page, level, text, [], location));
+      this._page._addConsoleMessage(level, [], location, text);
     }
   }
 

src/server/firefox/ffPage.ts

@@ -232,7 +232,7 @@ export class FFPage implements PageDelegate {
     const error = new Error(message);
     error.stack = params.message + '\n' + params.stack.split('\n').filter(Boolean).map(a => a.replace(/([^@]*)@(.*)/, '    at $1 ($2)')).join('\n');
     error.name = name;
-    this._page.emit(Page.Events.PageError, error);
+    this._page.firePageError(error);
   }
 
   _onConsole(payload: Protocol.Runtime.consolePayload) {

src/server/page.ts

@@ -504,6 +504,10 @@ export class Page extends SdkObject {
   setScreencastOptions(options: { width: number, height: number, quality: number } | null) {
     this._delegate.setScreencastOptions(options).catch(e => debugLogger.log('error', e));
   }
+
+  firePageError(error: Error) {
+    this.emit(Page.Events.PageError, error);
+  }
 }
 
 export class Worker extends SdkObject {

src/server/trace/viewer/traceViewer.ts

@@ -25,10 +25,12 @@ import { TraceEvent } from '../common/traceEvents';
 import { ServerRouteHandler, HttpServer } from '../../../utils/httpServer';
 import { SnapshotServer } from '../../snapshot/snapshotServer';
 import * as consoleApiSource from '../../../generated/consoleApiSource';
-import { isUnderTest } from '../../../utils/utils';
+import { canAccessFile, isUnderTest } from '../../../utils/utils';
 import { internalCallMetadata } from '../../instrumentation';
 import { ProgressController } from '../../progress';
 import { BrowserContext } from '../../browserContext';
+import { Registry } from '../../../utils/registry';
+import { findChromiumChannel } from '../../chromium/findChromiumChannel';
 
 export class TraceViewer {
   private _server: HttpServer;
@@ -127,8 +129,38 @@ export class TraceViewer {
     ] : [];
     if (isUnderTest())
       args.push(`--remote-debugging-port=0`);
+
+    // For Chromium, fall back to the stable channels of popular vendors for work out of the box.
+    // Null means no installation and no channels found.
+    let channel = null;
+    if (traceViewerBrowser === 'chromium') {
+      const registry = Registry.currentPackageRegistry();
+      if (canAccessFile(registry.executablePath('chromium')!)) {
+        // This means we have a browser downloaded.
+        channel = undefined;
+      } else {
+        for (const c of ['chrome', 'msedge']) {
+          try {
+            findChromiumChannel(c);
+            channel = c;
+            break;
+          } catch (e) {
+          }
+        }
+      }
+
+      if (channel === null) {
+        throw new Error(`
+==================================================================
+Please run 'npx playwright install' to install Playwright browsers
+==================================================================
+`);
+      }
+    }
+
     const context = await traceViewerPlaywright[traceViewerBrowser as 'chromium'].launchPersistentContext(internalCallMetadata(), '', {
       // TODO: store language in the trace.
+      channel: channel as any,
       sdkLanguage: 'javascript',
       args,
       noDefaultViewport: true,

src/server/webkit/wkPage.ts

@@ -517,7 +517,7 @@ export class WKPage implements PageDelegate {
       error.stack = stack;
       error.name = name;
 
-      this._page.emit(Page.Events.PageError, error);
+      this._page.firePageError(error);
       return;
     }
 

utils/check_deps.js

@@ -161,7 +161,7 @@ DEPS['src/utils/'] = ['src/common/'];
 // Trace viewer
 DEPS['src/server/trace/common/'] = ['src/server/snapshot/', ...DEPS['src/server/']];
 DEPS['src/server/trace/recorder/'] = ['src/server/trace/common/', ...DEPS['src/server/trace/common/']];
-DEPS['src/server/trace/viewer/'] = ['src/server/trace/common/', ...DEPS['src/server/trace/common/']];
+DEPS['src/server/trace/viewer/'] = ['src/server/trace/common/', 'src/server/chromium/', ...DEPS['src/server/trace/common/']];
 
 DEPS['src/test/'] = ['src/test/**', 'src/utils/utils.ts'];