RPP: Resolve Chrome extension names for entities and TreeViews

Chrome extension name resolving was already available to
AggregatedTimelineTreeView, but now, we'll update the associated Entity.
This shifts the source of truth (of origins) towards our entity names.

Bug: 395745032
Change-Id: Ie7738d2e81c9acbc0aef8f29306309e248902e8c
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/6292329
Commit-Queue: Paul Irish <[email protected]>
Reviewed-by: Adriana Ixba <[email protected]>
Auto-Submit: Paul Irish <[email protected]>

Author: paulirish

front_end/models/trace/handlers/helpers.ts

@@ -133,7 +133,7 @@ function makeUpChromeExtensionEntity(entityCache: Map<string, Entity>, url: stri
     category: 'Chrome Extension',
     homepage: 'https://chromewebstore.google.com/detail/' + host,
     categories: [],
-    domains: [],
+    domains: [origin],
     averageExecutionTime: 0,
     totalExecutionTime: 0,
     totalOccurrences: 0,

front_end/panels/timeline/TimelineDetailsView.ts

@@ -294,7 +294,7 @@ export class TimelineDetailsPane extends
     }
     this.tabbedPane.closeTabs([Tab.PaintProfiler, Tab.LayerViewer], false);
     for (const view of this.rangeDetailViews.values()) {
-      view.setModelWithEvents(data.selectedEvents, data.parsedTrace);
+      view.setModelWithEvents(data.selectedEvents, data.parsedTrace, data.entityMapper);
     }
     // Set the 3p tree model.
     this.#thirdPartyTree.setModelWithEvents(data.selectedEvents, data.parsedTrace, data.entityMapper);

front_end/panels/timeline/TimelineTreeView.ts

@@ -7,7 +7,6 @@ import '../../ui/legacy/legacy.js';
 import * as Common from '../../core/common/common.js';
 import * as i18n from '../../core/i18n/i18n.js';
 import * as Platform from '../../core/platform/platform.js';
-import * as SDK from '../../core/sdk/sdk.js';
 import * as Trace from '../../models/trace/trace.js';
 import * as ThirdPartyWeb from '../../third_party/third-party-web/third-party-web.js';
 import * as Buttons from '../../ui/components/buttons/buttons.js';
@@ -889,7 +888,6 @@ const treeNodeToGridNode = new WeakMap<Trace.Extras.TraceTree.Node, TreeGridNode
 export class AggregatedTimelineTreeView extends TimelineTreeView {
   protected readonly groupBySetting: Common.Settings.Setting<AggregatedTimelineTreeView.GroupBy>;
   readonly stackView: TimelineStackView;
-  private executionContextNamesByOrigin = new Map<Platform.DevToolsPath.UrlString, string>();
 
   constructor() {
     super();
@@ -906,7 +904,6 @@ export class AggregatedTimelineTreeView extends TimelineTreeView {
   }
 
   override updateContents(selection: TimelineSelection): void {
-    this.updateExtensionResolver();
     super.updateContents(selection);
     const rootNode = this.dataGrid.rootNode();
     if (rootNode.children.length) {
@@ -915,22 +912,14 @@ export class AggregatedTimelineTreeView extends TimelineTreeView {
     this.updateDetailsForSelection();
   }
 
-  private updateExtensionResolver(): void {
-    this.executionContextNamesByOrigin = new Map();
-    for (const runtimeModel of SDK.TargetManager.TargetManager.instance().models(SDK.RuntimeModel.RuntimeModel)) {
-      for (const context of runtimeModel.executionContexts()) {
-        this.executionContextNamesByOrigin.set(context.origin, context.name);
-      }
-    }
-  }
-
-  private beautifyDomainName(this: AggregatedTimelineTreeView, name: string): string {
+  private beautifyDomainName(this: AggregatedTimelineTreeView, name: string, node: Trace.Extras.TraceTree.Node):
+      string {
     if (AggregatedTimelineTreeView.isExtensionInternalURL(name as Platform.DevToolsPath.UrlString)) {
       name = i18nString(UIStrings.chromeExtensionsOverhead);
     } else if (AggregatedTimelineTreeView.isV8NativeURL(name as Platform.DevToolsPath.UrlString)) {
       name = i18nString(UIStrings.vRuntime);
     } else if (name.startsWith('chrome-extension')) {
-      name = this.executionContextNamesByOrigin.get(name as Platform.DevToolsPath.UrlString) || name;
+      name = this.entityMapper()?.entityForEvent(node.event)?.name || name;
     }
     return name;
   }
@@ -956,7 +945,7 @@ export class AggregatedTimelineTreeView extends TimelineTreeView {
       case AggregatedTimelineTreeView.GroupBy.Domain:
       case AggregatedTimelineTreeView.GroupBy.Subdomain:
       case AggregatedTimelineTreeView.GroupBy.ThirdParties: {
-        const domainName = id ? this.beautifyDomainName(id) : undefined;
+        const domainName = id ? this.beautifyDomainName(id, node) : undefined;
         return {name: domainName || unattributed, color, icon: undefined};
       }
 

front_end/panels/timeline/utils/EntityMapper.ts

@@ -2,6 +2,7 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
+import type * as Platform from '../../../core/platform/platform.js';
 import type * as Protocol from '../../../generated/protocol.js';
 import * as Trace from '../../../models/trace/trace.js';
 
@@ -164,4 +165,16 @@ export class EntityMapper {
     // Update our CallFrame cache when we've got a resolved entity.
     this.#resolvedCallFrames.add(callFrame);
   }
+
+  // Update entities with proper Chrome Extension names.
+  updateExtensionEntitiesWithName(executionContextNamesByOrigin: Map<Platform.DevToolsPath.UrlString, string>): void {
+    const entities = Array.from(this.#entityMappings.eventsByEntity.keys());
+    for (const [origin, name] of executionContextNamesByOrigin) {
+      // In makeUpChromeExtensionEntity, the extension origin is set as the only domain for the entity.
+      const entity = entities.find(e => e.domains[0] === origin);
+      if (entity) {
+        entity.name = entity.company = name;
+      }
+    }
+  }
 }

front_end/panels/timeline/utils/SourceMapsResolver.ts

@@ -19,19 +19,16 @@ interface ResolvedCodeLocationData {
 }
 export class SourceMappingsUpdated extends Event {
   static readonly eventName = 'sourcemappingsupdated';
-
   constructor() {
-    super(SourceMappingsUpdated.eventName, {
-      composed: true,
-      bubbles: true,
-    });
+    super(SourceMappingsUpdated.eventName, {composed: true, bubbles: true});
   }
 }
 
 // The code location key is created as a concatenation of its fields.
 export const resolvedCodeLocationDataNames = new Map<string, ResolvedCodeLocationData|null>();
 
 export class SourceMapsResolver extends EventTarget {
+  private executionContextNamesByOrigin = new Map<Platform.DevToolsPath.UrlString, string>();
   #parsedTrace: Trace.Handlers.Types.ParsedTrace;
   #entityMapper: EntityMapper.EntityMapper|null = null;
 
@@ -141,6 +138,8 @@ export class SourceMapsResolver extends EventTarget {
           SDK.SourceMapManager.Events.SourceMapAttached, this.#onAttachedSourceMap, this);
     }
 
+    this.#updateExtensionNames();
+
     // Although we have added listeners for SourceMapAttached events, we also
     // immediately try to resolve function names. This ensures we use any
     // sourcemaps that were attached before we bound our event listener.
@@ -231,4 +230,13 @@ export class SourceMapsResolver extends EventTarget {
     }
     return SDK.TargetManager.TargetManager.instance().primaryPageTarget();
   }
+
+  #updateExtensionNames(): void {
+    for (const runtimeModel of SDK.TargetManager.TargetManager.instance().models(SDK.RuntimeModel.RuntimeModel)) {
+      for (const context of runtimeModel.executionContexts()) {
+        this.executionContextNamesByOrigin.set(context.origin, context.name);
+      }
+    }
+    this.#entityMapper?.updateExtensionEntitiesWithName(this.executionContextNamesByOrigin);
+  }
 }