chrome-devtools-frontend 1.0.1512349 → 1.0.1514545

package/front_end/panels/timeline/components/LayoutShiftDetails.ts

@@ -1,4 +1,4 @@
-// Copyright 2024 The Chromium Authors. All rights reserved.
+// Copyright 2024 The Chromium Authors
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
@@ -12,7 +12,6 @@ import * as Buttons from '../../../ui/components/buttons/buttons.js';
 import * as LegacyComponents from '../../../ui/legacy/components/utils/utils.js';
 import * as UI from '../../../ui/legacy/legacy.js';
 import * as Lit from '../../../ui/lit/lit.js';
-import * as Utils from '../utils/utils.js';
 
 import * as Insights from './insights/insights.js';
 import layoutShiftDetailsStyles from './layoutShiftDetails.css.js';
@@ -83,8 +82,7 @@ const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
 
 export interface ViewInput {
   event: Trace.Types.Events.SyntheticLayoutShift|Trace.Types.Events.SyntheticLayoutShiftCluster|null;
-  traceInsightsSets: Trace.Insights.Types.TraceInsightSets|null;
-  parsedTrace: Trace.Handlers.Types.ParsedTrace|null;
+  parsedTrace: Trace.TraceModel.ParsedTrace|null;
   isFreshRecording: boolean;
   togglePopover: (e: MouseEvent) => void;
   onEventClick: (event: Trace.Types.Events.Event) => void;
@@ -93,8 +91,7 @@ export interface ViewInput {
 export class LayoutShiftDetails extends UI.Widget.Widget {
   #view: typeof DEFAULT_VIEW;
   #event: Trace.Types.Events.SyntheticLayoutShift|Trace.Types.Events.SyntheticLayoutShiftCluster|null = null;
-  #traceInsightsSets: Trace.Insights.Types.TraceInsightSets|null = null;
-  #parsedTrace: Trace.Handlers.Types.ParsedTrace|null = null;
+  #parsedTrace: Trace.TraceModel.ParsedTrace|null = null;
   #isFreshRecording = false;
 
   constructor(element?: HTMLElement, view = DEFAULT_VIEW) {
@@ -107,12 +104,7 @@ export class LayoutShiftDetails extends UI.Widget.Widget {
     void this.requestUpdate();
   }
 
-  set traceInsightsSets(traceInsightsSets: Trace.Insights.Types.TraceInsightSets|null) {
-    this.#traceInsightsSets = traceInsightsSets;
-    void this.requestUpdate();
-  }
-
-  set parsedTrace(parsedTrace: Trace.Handlers.Types.ParsedTrace|null) {
+  set parsedTrace(parsedTrace: Trace.TraceModel.ParsedTrace|null) {
     this.#parsedTrace = parsedTrace;
     void this.requestUpdate();
   }
@@ -154,7 +146,6 @@ export class LayoutShiftDetails extends UI.Widget.Widget {
     this.#view(
         {
           event: this.#event,
-          traceInsightsSets: this.#traceInsightsSets,
           parsedTrace: this.#parsedTrace,
           isFreshRecording: this.#isFreshRecording,
           togglePopover: e => this.#togglePopover(e),
@@ -171,7 +162,7 @@ export const DEFAULT_VIEW: (input: ViewInput, output: object, target: HTMLElemen
         return;
       }
 
-      const title = Utils.EntryName.nameForEntry(input.event);
+      const title = Trace.Name.forEntry(input.event);
       // clang-format off
       render(html`
         <style>${layoutShiftDetailsStyles}</style>
@@ -189,9 +180,9 @@ export const DEFAULT_VIEW: (input: ViewInput, output: object, target: HTMLElemen
         </div>
         ${Trace.Types.Events.isSyntheticLayoutShift(input.event) ?
           renderLayoutShiftDetails(
-            input.event, input.traceInsightsSets, input.parsedTrace, input.isFreshRecording, input.onEventClick,
+            input.event, input.parsedTrace.insights, input.parsedTrace, input.isFreshRecording, input.onEventClick,
          ) : renderLayoutShiftClusterDetails(
-           input.event, input.traceInsightsSets, input.parsedTrace, input.onEventClick,
+           input.event, input.parsedTrace.insights, input.parsedTrace, input.onEventClick,
          )}
         </div>
       </div>
@@ -201,7 +192,7 @@ export const DEFAULT_VIEW: (input: ViewInput, output: object, target: HTMLElemen
 
 function renderLayoutShiftDetails(
     layoutShift: Trace.Types.Events.SyntheticLayoutShift, traceInsightsSets: Trace.Insights.Types.TraceInsightSets|null,
-    parsedTrace: Trace.Handlers.Types.ParsedTrace, isFreshRecording: boolean,
+    parsedTrace: Trace.TraceModel.ParsedTrace, isFreshRecording: boolean,
     onEventClick: (e: Trace.Types.Events.Event) => void): Lit.LitTemplate {
   if (!traceInsightsSets) {
     return Lit.nothing;
@@ -252,7 +243,7 @@ function renderLayoutShiftDetails(
 
 function renderLayoutShiftClusterDetails(
     cluster: Trace.Types.Events.SyntheticLayoutShiftCluster,
-    traceInsightsSets: Trace.Insights.Types.TraceInsightSets|null, parsedTrace: Trace.Handlers.Types.ParsedTrace,
+    traceInsightsSets: Trace.Insights.Types.TraceInsightSets|null, parsedTrace: Trace.TraceModel.ParsedTrace,
     onEventClick: (e: Trace.Types.Events.Event) => void): Lit.LitTemplate {
   if (!traceInsightsSets) {
     return Lit.nothing;
@@ -303,7 +294,7 @@ function renderLayoutShiftClusterDetails(
 
 function renderShiftRow(
     currentShift: Trace.Types.Events.SyntheticLayoutShift, userHasSingleShiftSelected: boolean,
-    parsedTrace: Trace.Handlers.Types.ParsedTrace, elementsShifted: Trace.Types.Events.TraceImpactedNode[],
+    parsedTrace: Trace.TraceModel.ParsedTrace, elementsShifted: Trace.Types.Events.TraceImpactedNode[],
     onEventClick: (e: Trace.Types.Events.Event) => void,
     rootCauses: Trace.Insights.Models.CLSCulprits.LayoutShiftRootCausesData|undefined): Lit.LitTemplate {
   const score = currentShift.args.data?.weighted_score_delta;
@@ -340,10 +331,10 @@ function renderShiftRow(
 function renderStartTime(
     shift: Trace.Types.Events.SyntheticLayoutShift,
     userHasSingleShiftSelected: boolean,
-    parsedTrace: Trace.Handlers.Types.ParsedTrace,
+    parsedTrace: Trace.TraceModel.ParsedTrace,
     onEventClick: (e: Trace.Types.Events.Event) => void,
     ): Lit.TemplateResult {
-  const ts = Trace.Types.Timing.Micro(shift.ts - parsedTrace.Meta.traceBounds.min);
+  const ts = Trace.Types.Timing.Micro(shift.ts - parsedTrace.data.Meta.traceBounds.min);
   if (userHasSingleShiftSelected) {
     return html`${i18n.TimeUtilities.preciseMillisToString(Helpers.Timing.microToMilli(ts))}`;
   }
@@ -356,12 +347,11 @@ function renderStartTime(
 
 function renderParentCluster(
     cluster: Trace.Types.Events.SyntheticLayoutShiftCluster|undefined,
-    onEventClick: (e: Trace.Types.Events.Event) => void,
-    parsedTrace: Trace.Handlers.Types.ParsedTrace): Lit.LitTemplate {
+    onEventClick: (e: Trace.Types.Events.Event) => void, parsedTrace: Trace.TraceModel.ParsedTrace): Lit.LitTemplate {
   if (!cluster) {
     return Lit.nothing;
   }
-  const ts = Trace.Types.Timing.Micro(cluster.ts - (parsedTrace?.Meta.traceBounds.min ?? 0));
+  const ts = Trace.Types.Timing.Micro(cluster.ts - (parsedTrace.data.Meta.traceBounds.min ?? 0));
   const clusterTs = i18n.TimeUtilities.formatMicroSecondsTime(ts);
 
   // clang-format off

package/front_end/panels/timeline/components/LiveMetricsView.ts

@@ -1,4 +1,4 @@
-// Copyright 2024 The Chromium Authors. All rights reserved.
+// Copyright 2024 The Chromium Authors
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 /* eslint-disable rulesdir/no-imperative-dom-api */
@@ -14,6 +14,7 @@ import './MetricCard.js';
 import * as Common from '../../../core/common/common.js';
 import * as i18n from '../../../core/i18n/i18n.js';
 import type * as Platform from '../../../core/platform/platform.js';
+import * as SDK from '../../../core/sdk/sdk.js';
 import * as CrUXManager from '../../../models/crux-manager/crux-manager.js';
 import * as EmulationModel from '../../../models/emulation/emulation.js';
 import * as LiveMetrics from '../../../models/live-metrics/live-metrics.js';
@@ -27,9 +28,9 @@ import type * as Settings from '../../../ui/components/settings/settings.js';
 import * as UI from '../../../ui/legacy/legacy.js';
 import * as Lit from '../../../ui/lit/lit.js';
 import * as VisualLogging from '../../../ui/visual_logging/visual_logging.js';
-import * as MobileThrottling from '../../mobile_throttling/mobile_throttling.js';
-import {getThrottlingRecommendations, md} from '../utils/Helpers.js';
+import {getThrottlingRecommendations} from '../utils/Helpers.js';
 
+import {md} from './insights/Helpers.js';
 import liveMetricsViewStyles from './liveMetricsView.css.js';
 import type {MetricCardData} from './MetricCard.js';
 import metricValueStyles from './metricValueStyles.css.js';
@@ -384,7 +385,9 @@ export class LiveMetricsView extends LegacyWrapper.LegacyWrapper.WrappableCompon
   }
 
   async #refreshFieldDataForCurrentPage(): Promise<void> {
-    await this.#cruxManager.refresh();
+    if (!this.#isNode) {
+      await this.#cruxManager.refresh();
+    }
     void ComponentHelpers.ScheduledRender.scheduleRender(this, this.#render);
   }
 
@@ -588,7 +591,7 @@ export class LiveMetricsView extends LegacyWrapper.LegacyWrapper.WrappableCompon
       return i18nString(UIStrings.tryDisablingThrottling);
     }
 
-    const conditions = MobileThrottling.ThrottlingPresets.ThrottlingPresets.getRecommendedNetworkPreset(rtt);
+    const conditions = SDK.NetworkManager.getRecommendedNetworkPreset(rtt);
     if (!conditions) {
       return null;
     }

package/front_end/panels/timeline/components/MetricCard.ts

@@ -1,4 +1,4 @@
-// Copyright 2024 The Chromium Authors. All rights reserved.
+// Copyright 2024 The Chromium Authors
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 /* eslint-disable rulesdir/no-lit-render-outside-of-view */

package/front_end/panels/timeline/components/MetricCompareStrings.ts

@@ -1,4 +1,4 @@
-// Copyright 2024 The Chromium Authors. All rights reserved.
+// Copyright 2024 The Chromium Authors
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 

package/front_end/panels/timeline/components/NetworkRequestDetails.ts

@@ -1,4 +1,4 @@
-// Copyright 2024 The Chromium Authors. All rights reserved.
+// Copyright 2024 The Chromium Authors
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
@@ -12,7 +12,6 @@ import * as Trace from '../../../models/trace/trace.js';
 import * as LegacyComponents from '../../../ui/legacy/components/utils/utils.js';
 import * as UI from '../../../ui/legacy/legacy.js';
 import * as Lit from '../../../ui/lit/lit.js';
-import type * as TimelineUtils from '../utils/utils.js';
 
 import networkRequestDetailsStyles from './networkRequestDetails.css.js';
 import networkRequestTooltipStyles from './networkRequestTooltip.css.js';
@@ -120,11 +119,11 @@ export class NetworkRequestDetails extends UI.Widget.Widget {
   #view: typeof DEFAULT_VIEW;
   #request: Trace.Types.Events.SyntheticNetworkRequest|null = null;
   #requestPreviewElements = new WeakMap<Trace.Types.Events.SyntheticNetworkRequest, HTMLElement>();
-  #entityMapper: TimelineUtils.EntityMapper.EntityMapper|null = null;
+  #entityMapper: Trace.EntityMapper.EntityMapper|null = null;
   #target: SDK.Target.Target|null = null;
   #linkifier: LegacyComponents.Linkifier.Linkifier|null = null;
   #serverTimings: SDK.ServerTiming.ServerTiming[]|null = null;
-  #parsedTrace: Trace.Handlers.Types.ParsedTrace|null = null;
+  #parsedTrace: Trace.TraceModel.ParsedTrace|null = null;
 
   constructor(element?: HTMLElement, view = DEFAULT_VIEW) {
     super(element);
@@ -137,7 +136,7 @@ export class NetworkRequestDetails extends UI.Widget.Widget {
     this.requestUpdate();
   }
 
-  set parsedTrace(parsedTrace: Trace.Handlers.Types.ParsedTrace|null) {
+  set parsedTrace(parsedTrace: Trace.TraceModel.ParsedTrace|null) {
     this.#parsedTrace = parsedTrace;
     this.requestUpdate();
   }
@@ -165,7 +164,7 @@ export class NetworkRequestDetails extends UI.Widget.Widget {
     this.requestUpdate();
   }
 
-  set entityMapper(mapper: TimelineUtils.EntityMapper.EntityMapper|null) {
+  set entityMapper(mapper: Trace.EntityMapper.EntityMapper|null) {
     this.#entityMapper = mapper;
     this.requestUpdate();
   }
@@ -189,10 +188,10 @@ export interface ViewInput {
   request: Trace.Types.Events.SyntheticNetworkRequest|null;
   target: SDK.Target.Target|null;
   previewElementsCache: WeakMap<Trace.Types.Events.SyntheticNetworkRequest, HTMLElement>;
-  entityMapper: TimelineUtils.EntityMapper.EntityMapper|null;
+  entityMapper: Trace.EntityMapper.EntityMapper|null;
   serverTimings: SDK.ServerTiming.ServerTiming[]|null;
   linkifier: LegacyComponents.Linkifier.Linkifier|null;
-  parsedTrace: Trace.Handlers.Types.ParsedTrace|null;
+  parsedTrace: Trace.TraceModel.ParsedTrace|null;
 }
 
 export const DEFAULT_VIEW: (
@@ -393,7 +392,7 @@ function renderFromCache(
 
 function renderThirdPartyEntity(
     request: Trace.Types.Events.SyntheticNetworkRequest,
-    entityMapper: TimelineUtils.EntityMapper.EntityMapper|null): Lit.LitTemplate {
+    entityMapper: Trace.EntityMapper.EntityMapper|null): Lit.LitTemplate {
   if (!entityMapper) {
     return Lit.nothing;
   }
@@ -428,7 +427,7 @@ function renderServerTimings(timings: SDK.ServerTiming.ServerTiming[]|null): Lit
 }
 function renderInitiatedBy(
     request: Trace.Types.Events.SyntheticNetworkRequest,
-    parsedTrace: Trace.Handlers.Types.ParsedTrace|null,
+    parsedTrace: Trace.TraceModel.ParsedTrace|null,
     target: SDK.Target.Target|null,
     linkifier: LegacyComponents.Linkifier.Linkifier|null,
     ): Lit.LitTemplate {
@@ -445,13 +444,13 @@ function renderInitiatedBy(
   };
   // If we have a stack trace, that is the most reliable way to get the initiator data and display a link to the source.
   if (hasStackTrace) {
-    const topFrame = Trace.Helpers.Trace.getZeroIndexedStackTraceInEventPayload(request)?.at(0) ?? null;
+    const topFrame = Trace.Helpers.Trace.getStackTraceTopCallFrameInEventPayload(request) ?? null;
     if (topFrame) {
       link = linkifier.maybeLinkifyConsoleCallFrame(target, topFrame, options);
     }
   }
   // If we do not, we can see if the network handler found an initiator and try to link by URL
-  const initiator = parsedTrace?.NetworkRequests.eventToInitiator.get(request);
+  const initiator = parsedTrace?.data.NetworkRequests.eventToInitiator.get(request);
   if (initiator) {
     link = linkifier.maybeLinkifyScriptLocation(
         target,

package/front_end/panels/timeline/components/NetworkRequestTooltip.ts

@@ -1,4 +1,4 @@
-// Copyright 2024 The Chromium Authors. All rights reserved.
+// Copyright 2024 The Chromium Authors
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 /* eslint-disable rulesdir/no-lit-render-outside-of-view */
@@ -58,7 +58,7 @@ const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
 
 export interface NetworkTooltipData {
   networkRequest: Trace.Types.Events.SyntheticNetworkRequest|null;
-  entityMapper: TimelineUtils.EntityMapper.EntityMapper|null;
+  entityMapper: Trace.EntityMapper.EntityMapper|null;
 }
 
 export class NetworkRequestTooltip extends HTMLElement {

package/front_end/panels/timeline/components/NetworkThrottlingSelector.ts

@@ -1,4 +1,4 @@
-// Copyright 2024 The Chromium Authors. All rights reserved.
+// Copyright 2024 The Chromium Authors
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 /* eslint-disable rulesdir/no-lit-render-outside-of-view */

package/front_end/panels/timeline/components/OriginMap.ts

@@ -1,4 +1,4 @@
-// Copyright 2024 The Chromium Authors. All rights reserved.
+// Copyright 2024 The Chromium Authors
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 /* eslint-disable rulesdir/no-imperative-dom-api */

package/front_end/panels/timeline/components/RelatedInsightChips.ts

@@ -1,4 +1,4 @@
-// Copyright 2024 The Chromium Authors. All rights reserved.
+// Copyright 2024 The Chromium Authors
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 

package/front_end/panels/timeline/components/Sidebar.ts

@@ -1,4 +1,4 @@
-// Copyright 2024 The Chromium Authors. All rights reserved.
+// Copyright 2024 The Chromium Authors
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 /* eslint-disable rulesdir/no-imperative-dom-api */
@@ -134,16 +134,11 @@ export class SidebarWidget extends UI.Widget.VBox {
     this.#tabbedPane.setBadge('annotations', annotations.length > 0 ? annotations.length.toString() : null);
   }
 
-  setParsedTrace(parsedTrace: Trace.Handlers.Types.ParsedTrace|null, metadata: Trace.Types.File.MetaData|null): void {
-    this.#insightsView.setParsedTrace(parsedTrace, metadata);
-  }
-
-  setInsights(insights: Trace.Insights.Types.TraceInsightSets|null): void {
-    this.#insightsView.setInsights(insights);
-
+  setParsedTrace(parsedTrace: Trace.TraceModel.ParsedTrace|null): void {
+    this.#insightsView.setParsedTrace(parsedTrace);
     this.#tabbedPane.setTabEnabled(
         SidebarTabs.INSIGHTS,
-        insights !== null && insights.size > 0,
+        Boolean(parsedTrace?.insights && parsedTrace.insights.size > 0),
     );
   }
 
@@ -167,13 +162,8 @@ class InsightsView extends UI.Widget.VBox {
     this.element.appendChild(this.#component);
   }
 
-  setParsedTrace(parsedTrace: Trace.Handlers.Types.ParsedTrace|null, metadata: Trace.Types.File.MetaData|null): void {
+  setParsedTrace(parsedTrace: Trace.TraceModel.ParsedTrace|null): void {
     this.#component.parsedTrace = parsedTrace;
-    this.#component.traceMetadata = metadata;
-  }
-
-  setInsights(data: Trace.Insights.Types.TraceInsightSets|null): void {
-    this.#component.insights = data;
   }
 
   getActiveInsight(): ActiveInsight|null {

package/front_end/panels/timeline/components/SidebarAnnotationsTab.ts

@@ -1,4 +1,4 @@
-// Copyright 2024 The Chromium Authors. All rights reserved.
+// Copyright 2024 The Chromium Authors
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 /* eslint-disable rulesdir/no-lit-render-outside-of-view */
@@ -12,7 +12,6 @@ import * as UI from '../../../ui/legacy/legacy.js';
 import * as ThemeSupport from '../../../ui/legacy/theme_support/theme_support.js';
 import * as Lit from '../../../ui/lit/lit.js';
 import * as VisualLogging from '../../../ui/visual_logging/visual_logging.js';
-import * as Utils from '../utils/utils.js';
 
 import {AnnotationHoverOut, HoverAnnotation, RemoveAnnotation, RevealAnnotation} from './Sidebar.js';
 import sidebarAnnotationsTabStyles from './sidebarAnnotationsTab.css.js';
@@ -226,7 +225,7 @@ export class SidebarAnnotationsTab extends UI.Widget.Widget {
 function detailedAriaDescriptionForAnnotation(annotation: Trace.Types.File.Annotation): string {
   switch (annotation.type) {
     case 'ENTRY_LABEL': {
-      const name = Utils.EntryName.nameForEntry(annotation.entry);
+      const name = Trace.Name.forEntry(annotation.entry);
       return i18nString(UIStrings.entryLabelDescriptionLabel, {
         PH1: name,
         PH2: annotation.label,
@@ -245,8 +244,8 @@ function detailedAriaDescriptionForAnnotation(annotation: Trace.Types.File.Annot
         // Only label it if it is completed.
         return '';
       }
-      const nameFrom = Utils.EntryName.nameForEntry(annotation.entryFrom);
-      const nameTo = Utils.EntryName.nameForEntry(annotation.entryTo);
+      const nameFrom = Trace.Name.forEntry(annotation.entryFrom);
+      const nameTo = Trace.Name.forEntry(annotation.entryTo);
       return i18nString(UIStrings.entryLinkDescriptionLabel, {
         PH1: nameFrom,
         PH2: nameTo,
@@ -279,7 +278,7 @@ function renderAnnotationIdentifier(
     Lit.LitTemplate {
   switch (annotation.type) {
     case 'ENTRY_LABEL': {
-      const entryName = Utils.EntryName.nameForEntry(annotation.entry);
+      const entryName = Trace.Name.forEntry(annotation.entry);
       const backgroundColor = annotationEntryToColorMap.get(annotation.entry) ?? '';
       const color = findTextColorForContrast(backgroundColor);
       const styleForAnnotationIdentifier = {
@@ -308,7 +307,7 @@ function renderAnnotationIdentifier(
       `;
     }
     case 'ENTRIES_LINK': {
-      const entryFromName = Utils.EntryName.nameForEntry(annotation.entryFrom);
+      const entryFromName = Trace.Name.forEntry(annotation.entryFrom);
       const fromBackgroundColor = annotationEntryToColorMap.get(annotation.entryFrom) ?? '';
       const fromTextColor = findTextColorForContrast(fromBackgroundColor);
       const styleForFromAnnotationIdentifier = {
@@ -349,7 +348,7 @@ function renderEntryToIdentifier(
     annotationEntryToColorMap: ReadonlyMap<Trace.Types.Events.Event|Trace.Types.Events.LegacyTimelineFrame, string>):
     Lit.LitTemplate {
   if (annotation.entryTo) {
-    const entryToName = Utils.EntryName.nameForEntry(annotation.entryTo);
+    const entryToName = Trace.Name.forEntry(annotation.entryTo);
     const toBackgroundColor = annotationEntryToColorMap.get(annotation.entryTo) ?? '';
     const toTextColor = findTextColorForContrast(toBackgroundColor);
     const styleForToAnnotationIdentifier = {

package/front_end/panels/timeline/components/SidebarInsightsTab.ts

@@ -1,4 +1,4 @@
-// Copyright 2024 The Chromium Authors. All rights reserved.
+// Copyright 2024 The Chromium Authors
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 /* eslint-disable rulesdir/no-lit-render-outside-of-view */
@@ -20,9 +20,7 @@ const {html} = Lit;
 
 export class SidebarInsightsTab extends HTMLElement {
   readonly #shadow = this.attachShadow({mode: 'open'});
-  #parsedTrace: Trace.Handlers.Types.ParsedTrace|null = null;
-  #traceMetadata: Trace.Types.File.MetaData|null = null;
-  #insights: Trace.Insights.Types.TraceInsightSets|null = null;
+  #parsedTrace: Trace.TraceModel.ParsedTrace|null = null;
   #activeInsight: ActiveInsight|null = null;
   #selectedCategory = Trace.Insights.Types.InsightCategory.ALL;
   /**
@@ -35,39 +33,19 @@ export class SidebarInsightsTab extends HTMLElement {
 
   // TODO(paulirish): add back a disconnectedCallback() to avoid memory leaks that doesn't cause b/372943062
 
-  set parsedTrace(data: Trace.Handlers.Types.ParsedTrace|null) {
+  set parsedTrace(data: Trace.TraceModel.ParsedTrace|null) {
     if (data === this.#parsedTrace) {
       return;
     }
-    this.#parsedTrace = data;
-    this.#selectedInsightSetKey = null;
-
-    void ComponentHelpers.ScheduledRender.scheduleRender(this, this.#render);
-  }
 
-  set traceMetadata(data: Trace.Types.File.MetaData|null) {
-    if (data === this.#traceMetadata) {
-      return;
-    }
-    this.#traceMetadata = data;
+    this.#parsedTrace = data;
     this.#selectedInsightSetKey = null;
 
-    void ComponentHelpers.ScheduledRender.scheduleRender(this, this.#render);
-  }
-
-  set insights(data: Trace.Insights.Types.TraceInsightSets|null) {
-    if (data === this.#insights) {
-      return;
-    }
-
-    this.#selectedInsightSetKey = null;
-    if (!data || !this.#parsedTrace) {
-      return;
+    if (this.#parsedTrace?.insights) {
+      /** Select the first set. Filtering out trivial sets was done back in {@link Trace.Processor.#computeInsightsForInitialTracePeriod} */
+      this.#selectedInsightSetKey = [...this.#parsedTrace.insights.keys()].at(0) ?? null;
     }
 
-    this.#insights = new Map(data);
-    /** Select the first set. Filtering out trivial sets was done back in {@link Trace.Processor.#computeInsightsForInitialTracePeriod} */
-    this.#selectedInsightSetKey = [...this.#insights.keys()].at(0) ?? null;
     void ComponentHelpers.ScheduledRender.scheduleRender(this, this.#render);
   }
 
@@ -102,7 +80,7 @@ export class SidebarInsightsTab extends HTMLElement {
   }
 
   #insightSetHovered(id: string): void {
-    const data = this.#insights?.get(id);
+    const data = this.#parsedTrace?.insights?.get(id);
     data && this.dispatchEvent(new Insights.SidebarInsight.InsightSetHovered(data.bounds));
   }
 
@@ -112,7 +90,7 @@ export class SidebarInsightsTab extends HTMLElement {
 
   #onZoomClick(event: Event, id: string): void {
     event.stopPropagation();
-    const data = this.#insights?.get(id);
+    const data = this.#parsedTrace?.insights?.get(id);
     if (!data) {
       return;
     }
@@ -170,27 +148,26 @@ export class SidebarInsightsTab extends HTMLElement {
   }
 
   #render(): void {
-    if (!this.#parsedTrace || !this.#insights) {
+    if (!this.#parsedTrace?.insights) {
       Lit.render(Lit.nothing, this.#shadow, {host: this});
       return;
     }
 
-    const hasMultipleInsightSets = this.#insights.size > 1;
-    const labels = Utils.Helpers.createUrlLabels([...this.#insights.values()].map(({url}) => url));
+    const insights = this.#parsedTrace.insights;
+    const hasMultipleInsightSets = insights.size > 1;
+    const labels = Utils.Helpers.createUrlLabels([...insights.values()].map(({url}) => url));
 
     const contents =
         // clang-format off
      html`
       <style>${sidebarInsightsTabStyles}</style>
       <div class="insight-sets-wrapper">
-        ${[...this.#insights.values()].map(({id, url}, index) => {
+        ${[...insights.values()].map(({id, url}, index) => {
           const data: SidebarSingleInsightSetData = {
-            insights: this.#insights,
             insightSetKey: id,
             activeCategory: this.#selectedCategory,
             activeInsight: this.#activeInsight,
             parsedTrace: this.#parsedTrace,
-            traceMetadata: this.#traceMetadata,
           };
 
           const contents = html`