From 6bbc09c96cf96b730ac91f6b991dc88c9bbda052 Mon Sep 17 00:00:00 2001
From: Max Schmitt <max@schmitt.mx>
Date: Mon, 11 Sep 2023 23:06:56 +0200
Subject: [PATCH] chore: show channel name in trace viewer metadata (#26987)

Fixes https://github.com/microsoft/playwright/issues/26986
---
 packages/playwright-core/src/server/trace/recorder/tracing.ts | 1 +
 packages/trace-viewer/src/entries.ts                          | 1 +
 packages/trace-viewer/src/traceModel.ts                       | 1 +
 packages/trace-viewer/src/ui/metadataView.tsx                 | 1 +
 packages/trace-viewer/src/ui/modelUtil.ts                     | 2 ++
 packages/trace/src/trace.ts                                   | 1 +
 6 files changed, 7 insertions(+)

diff --git a/packages/playwright-core/src/server/trace/recorder/tracing.ts b/packages/playwright-core/src/server/trace/recorder/tracing.ts
index 7b20832342f55..04cbfd2bd8a7a 100644
--- a/packages/playwright-core/src/server/trace/recorder/tracing.ts
+++ b/packages/playwright-core/src/server/trace/recorder/tracing.ts
@@ -109,6 +109,7 @@ export class Tracing extends SdkObject implements InstrumentationListener, Snaps
       this._snapshotter = new Snapshotter(context, this);
       assert(tracesDir, 'tracesDir must be specified for BrowserContext');
       this._contextCreatedEvent.browserName = context._browser.options.name;
+      this._contextCreatedEvent.channel = context._browser.options.channel;
       this._contextCreatedEvent.options = context._options;
     }
   }
diff --git a/packages/trace-viewer/src/entries.ts b/packages/trace-viewer/src/entries.ts
index 16b42523a8a5e..cc7abc06e4daa 100644
--- a/packages/trace-viewer/src/entries.ts
+++ b/packages/trace-viewer/src/entries.ts
@@ -24,6 +24,7 @@ export type ContextEntry = {
   startTime: number;
   endTime: number;
   browserName: string;
+  channel?: string;
   platform?: string;
   wallTime?: number;
   sdkLanguage?: Language;
diff --git a/packages/trace-viewer/src/traceModel.ts b/packages/trace-viewer/src/traceModel.ts
index df7ae5998864b..9158922b22b37 100644
--- a/packages/trace-viewer/src/traceModel.ts
+++ b/packages/trace-viewer/src/traceModel.ts
@@ -156,6 +156,7 @@ export class TraceModel {
         this._version = event.version;
         contextEntry.isPrimary = true;
         contextEntry.browserName = event.browserName;
+        contextEntry.channel = event.channel;
         contextEntry.title = event.title;
         contextEntry.platform = event.platform;
         contextEntry.wallTime = event.wallTime;
diff --git a/packages/trace-viewer/src/ui/metadataView.tsx b/packages/trace-viewer/src/ui/metadataView.tsx
index b5254ba78df83..6cb315686abb2 100644
--- a/packages/trace-viewer/src/ui/metadataView.tsx
+++ b/packages/trace-viewer/src/ui/metadataView.tsx
@@ -30,6 +30,7 @@ export const MetadataView: React.FunctionComponent<{
     <div className='call-line'>duration:<span className='call-value number' title={msToString(model.endTime - model.startTime)}>{msToString(model.endTime - model.startTime)}</span></div>
     <div className='call-section'>Browser</div>
     <div className='call-line'>engine:<span className='call-value string' title={model.browserName}>{model.browserName}</span></div>
+    {model.channel && <div className='call-line'>channel:<span className='call-value string' title={model.channel}>{model.channel}</span></div>}
     {model.platform && <div className='call-line'>platform:<span className='call-value string' title={model.platform}>{model.platform}</span></div>}
     {model.options.userAgent && <div className='call-line'>user agent:<span className='call-value datetime' title={model.options.userAgent}>{model.options.userAgent}</span></div>}
     <div className='call-section'>Viewport</div>
diff --git a/packages/trace-viewer/src/ui/modelUtil.ts b/packages/trace-viewer/src/ui/modelUtil.ts
index 2028bdb5f88bb..dd42c8ac563c6 100644
--- a/packages/trace-viewer/src/ui/modelUtil.ts
+++ b/packages/trace-viewer/src/ui/modelUtil.ts
@@ -51,6 +51,7 @@ export class MultiTraceModel {
   readonly startTime: number;
   readonly endTime: number;
   readonly browserName: string;
+  readonly channel?: string;
   readonly platform?: string;
   readonly wallTime?: number;
   readonly title?: string;
@@ -72,6 +73,7 @@ export class MultiTraceModel {
 
     this.browserName = primaryContext?.browserName || '';
     this.sdkLanguage = primaryContext?.sdkLanguage;
+    this.channel = primaryContext?.channel;
     this.testIdAttributeName = primaryContext?.testIdAttributeName;
     this.platform = primaryContext?.platform || '';
     this.title = primaryContext?.title || '';
diff --git a/packages/trace/src/trace.ts b/packages/trace/src/trace.ts
index c639f784af704..1c9c65457d737 100644
--- a/packages/trace/src/trace.ts
+++ b/packages/trace/src/trace.ts
@@ -34,6 +34,7 @@ export type ContextCreatedTraceEvent = {
   version: number,
   type: 'context-options',
   browserName: string,
+  channel?: string,
   platform: string,
   wallTime: number,
   title?: string,