[RPP] Rename insights to match model/component separation

Also renamed a couple insight models to match their component name.

Bug: 371615739
Change-Id: I0776c4ed7cc1c37b9bd10695795b19c430d09317
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/5991675
Commit-Queue: Connor Clark <[email protected]>
Auto-Submit: Connor Clark <[email protected]>
Reviewed-by: Adam Raine <[email protected]>

Author: Connor Clark

config/gni/devtools_grd_files.gni

@@ -1076,16 +1076,16 @@ grd_files_debug_sources = [
   "front_end/models/trace/helpers/Timing.js",
   "front_end/models/trace/helpers/Trace.js",
   "front_end/models/trace/helpers/TreeHelpers.js",
+  "front_end/models/trace/insights/CLSCulprits.js",
   "front_end/models/trace/insights/Common.js",
-  "front_end/models/trace/insights/CumulativeLayoutShift.js",
   "front_end/models/trace/insights/DocumentLatency.js",
   "front_end/models/trace/insights/FontDisplay.js",
-  "front_end/models/trace/insights/InsightRunners.js",
   "front_end/models/trace/insights/InteractionToNextPaint.js",
   "front_end/models/trace/insights/LargestContentfulPaint.js",
+  "front_end/models/trace/insights/Models.js",
   "front_end/models/trace/insights/RenderBlocking.js",
   "front_end/models/trace/insights/SlowCSSSelector.js",
-  "front_end/models/trace/insights/ThirdPartyWeb.js",
+  "front_end/models/trace/insights/ThirdParties.js",
   "front_end/models/trace/insights/Viewport.js",
   "front_end/models/trace/insights/types.js",
   "front_end/models/trace/lantern/core/LanternError.js",

front_end/models/trace/Processor.test.ts

@@ -263,7 +263,7 @@ describeWithEnvironment('TraceProcessor', function() {
             generateInsight: () => {
               throw new Error('forced error');
             },
-            deps: Trace.Insights.InsightRunners.RenderBlocking.deps,
+            deps: Trace.Insights.Models.RenderBlocking.deps,
           },
         };
       });
@@ -278,8 +278,8 @@ describeWithEnvironment('TraceProcessor', function() {
 
       const insights = Array.from(processor.insights.values());
       assert.strictEqual(insights.length, 2);
-      assert(insights[1].data.RenderBlocking instanceof Error, 'RenderBlocking did not throw an error');
-      assert.strictEqual(insights[1].data.RenderBlocking.message, 'forced error');
+      assert(insights[1].model.RenderBlocking instanceof Error, 'RenderBlocking did not throw an error');
+      assert.strictEqual(insights[1].model.RenderBlocking.message, 'forced error');
     });
 
     it('skips insights that are missing one or more dependencies', async function() {
@@ -299,8 +299,8 @@ describeWithEnvironment('TraceProcessor', function() {
       ]);
 
       const insights = Array.from(processor.insights.values());
-      assert.isUndefined(insights[0].data.RenderBlocking);
-      assert.isUndefined(insights[1].data.RenderBlocking);
+      assert.isUndefined(insights[0].model.RenderBlocking);
+      assert.isUndefined(insights[1].model.RenderBlocking);
     });
 
     it('returns insights for a navigation', async function() {
@@ -318,15 +318,15 @@ describeWithEnvironment('TraceProcessor', function() {
       ]);
 
       const insights = Array.from(processor.insights.values());
-      if (insights[0].data.RenderBlocking instanceof Error) {
+      if (insights[0].model.RenderBlocking instanceof Error) {
         throw new Error('RenderBlocking threw an error');
       }
-      if (insights[1].data.RenderBlocking instanceof Error) {
+      if (insights[1].model.RenderBlocking instanceof Error) {
         throw new Error('RenderBlocking threw an error');
       }
 
-      assert.strictEqual(insights[0].data.RenderBlocking.renderBlockingRequests.length, 0);
-      assert.strictEqual(insights[1].data.RenderBlocking.renderBlockingRequests.length, 2);
+      assert.strictEqual(insights[0].model.RenderBlocking.renderBlockingRequests.length, 0);
+      assert.strictEqual(insights[1].model.RenderBlocking.renderBlockingRequests.length, 2);
     });
 
     it('returns insights for multiple navigations', async function() {
@@ -346,23 +346,23 @@ describeWithEnvironment('TraceProcessor', function() {
       ]);
 
       const insights = Array.from(processor.insights.values());
-      if (insights[0].data.RenderBlocking instanceof Error) {
+      if (insights[0].model.RenderBlocking instanceof Error) {
         throw new Error('RenderBlocking threw an error');
       }
-      if (insights[1].data.RenderBlocking instanceof Error) {
+      if (insights[1].model.RenderBlocking instanceof Error) {
         throw new Error('RenderBlocking threw an error');
       }
-      if (insights[2].data.RenderBlocking instanceof Error) {
+      if (insights[2].model.RenderBlocking instanceof Error) {
         throw new Error('RenderBlocking threw an error');
       }
-      if (insights[3].data.RenderBlocking instanceof Error) {
+      if (insights[3].model.RenderBlocking instanceof Error) {
         throw new Error('RenderBlocking threw an error');
       }
 
-      assert.strictEqual(insights[0].data.RenderBlocking.renderBlockingRequests.length, 0);
-      assert.strictEqual(insights[1].data.RenderBlocking.renderBlockingRequests.length, 0);
-      assert.strictEqual(insights[2].data.RenderBlocking.renderBlockingRequests.length, 0);
-      assert.strictEqual(insights[3].data.RenderBlocking.renderBlockingRequests.length, 1);
+      assert.strictEqual(insights[0].model.RenderBlocking.renderBlockingRequests.length, 0);
+      assert.strictEqual(insights[1].model.RenderBlocking.renderBlockingRequests.length, 0);
+      assert.strictEqual(insights[2].model.RenderBlocking.renderBlockingRequests.length, 0);
+      assert.strictEqual(insights[3].model.RenderBlocking.renderBlockingRequests.length, 1);
     });
   });
 });

front_end/models/trace/Processor.ts

@@ -76,9 +76,9 @@ export class TraceProcessor extends EventTarget {
     return new TraceProcessor(Handlers.ModelHandlers, Types.Configuration.defaults());
   }
 
-  static getEnabledInsightRunners(parsedTrace: Handlers.Types.ParsedTrace): Partial<Insights.Types.InsightRunnersType> {
-    const enabledInsights = {} as Insights.Types.InsightRunnersType;
-    for (const [name, insight] of Object.entries(Insights.InsightRunners)) {
+  static getEnabledInsightRunners(parsedTrace: Handlers.Types.ParsedTrace): Partial<Insights.Types.InsightModelsType> {
+    const enabledInsights = {} as Insights.Types.InsightModelsType;
+    for (const [name, insight] of Object.entries(Insights.Models)) {
       const deps = insight.deps();
       if (deps.some(dep => !parsedTrace[dep])) {
         continue;
@@ -344,8 +344,8 @@ export class TraceProcessor extends EventTarget {
 
   #computeInsightSets(
       insights: Insights.Types.TraceInsightSets, parsedTrace: Handlers.Types.ParsedTrace,
-      insightRunners: Partial<typeof Insights.InsightRunners>, context: Insights.Types.InsightSetContext): void {
-    const data = {} as Insights.Types.InsightSets['data'];
+      insightRunners: Partial<typeof Insights.Models>, context: Insights.Types.InsightSetContext): void {
+    const model = {} as Insights.Types.InsightSet['model'];
 
     for (const [name, insight] of Object.entries(insightRunners)) {
       let insightResult;
@@ -354,7 +354,7 @@ export class TraceProcessor extends EventTarget {
       } catch (err) {
         insightResult = err;
       }
-      Object.assign(data, {[name]: insightResult});
+      Object.assign(model, {[name]: insightResult});
     }
 
     let id, urlString, navigation;
@@ -382,7 +382,7 @@ export class TraceProcessor extends EventTarget {
       navigation,
       frameId: context.frameId,
       bounds: context.bounds,
-      data,
+      model,
     };
     insights.set(insightSets.id, insightSets);
   }

front_end/models/trace/insights/BUILD.gn

@@ -8,16 +8,16 @@ import("../../visibility.gni")
 
 devtools_module("insights") {
   sources = [
+    "CLSCulprits.ts",
     "Common.ts",
-    "CumulativeLayoutShift.ts",
     "DocumentLatency.ts",
     "FontDisplay.ts",
-    "InsightRunners.ts",
     "InteractionToNextPaint.ts",
     "LargestContentfulPaint.ts",
+    "Models.ts",
     "RenderBlocking.ts",
     "SlowCSSSelector.ts",
-    "ThirdPartyWeb.ts",
+    "ThirdParties.ts",
     "Viewport.ts",
     "types.ts",
   ]
@@ -45,14 +45,14 @@ ts_library("unittests") {
   testonly = true
 
   sources = [
-    "CumulativeLayoutShift.test.ts",
+    "CLSCulprits.test.ts",
     "DocumentLatency.test.ts",
     "FontDisplay.test.ts",
     "InteractionToNextPaint.test.ts",
     "LargestContentfulPaint.test.ts",
     "RenderBlocking.test.ts",
     "SlowCSSSelector.test.ts",
-    "ThirdPartyWeb.test.ts",
+    "ThirdParties.test.ts",
     "Viewport.test.ts",
   ]
 

…e/insights/CumulativeLayoutShift.test.ts …odels/trace/insights/CLSCulprits.test.tsfront_end/models/trace/insights/CumulativeLayoutShift.test.ts renamed to front_end/models/trace/insights/CLSCulprits.test.ts front_end/models/trace/insights/CumulativeLayoutShift.test.ts renamed to front_end/models/trace/insights/CLSCulprits.test.ts

@@ -8,7 +8,7 @@ import {TraceLoader} from '../../../testing/TraceLoader.js';
 import * as Helpers from '../helpers/helpers.js';
 import * as Types from '../types/types.js';
 
-import {InsightRunners} from './insights.js';
+import {Models} from './insights.js';
 
 export async function processTrace(testContext: Mocha.Suite|Mocha.Context|null, traceFile: string) {
   const {parsedTrace, insights} = await TraceLoader.traceEngine(testContext, traceFile);
@@ -22,12 +22,12 @@ export async function processTrace(testContext: Mocha.Suite|Mocha.Context|null,
 // Root cause invalidation window.
 const INVALIDATION_WINDOW = Helpers.Timing.secondsToMicroseconds(Types.Timing.Seconds(0.5));
 
-describeWithEnvironment('CumulativeLayoutShift', function() {
+describeWithEnvironment('CLSCulprits', function() {
   describe('non composited animations', function() {
     it('gets the correct non composited animations', async function() {
       const {data, insights} = await processTrace(this, 'non-composited-animation.json.gz');
       const firstNav = getFirstOrError(data.Meta.navigationsByNavigationId.values());
-      const insight = getInsightOrError('CumulativeLayoutShift', insights, firstNav);
+      const insight = getInsightOrError('CLSCulprits', insights, firstNav);
       const {animationFailures} = insight;
 
       const simpleAnimation = data.Animations.animations.find(animation => {
@@ -37,18 +37,18 @@ describeWithEnvironment('CumulativeLayoutShift', function() {
         return animation.args.data.beginEvent.args.data.displayName === 'top';
       });
 
-      const expected: InsightRunners.CumulativeLayoutShift.NoncompositedAnimationFailure[] = [
+      const expected: Models.CLSCulprits.NoncompositedAnimationFailure[] = [
         {
           name: 'simple-animation',
-          failureReasons: [InsightRunners.CumulativeLayoutShift.AnimationFailureReasons.UNSUPPORTED_CSS_PROPERTY],
+          failureReasons: [Models.CLSCulprits.AnimationFailureReasons.UNSUPPORTED_CSS_PROPERTY],
           unsupportedProperties: ['color'],
           animation: simpleAnimation,
         },
         {
           name: 'top',
           failureReasons: [
-            InsightRunners.CumulativeLayoutShift.AnimationFailureReasons.TARGET_HAS_INVALID_COMPOSITING_STATE,
-            InsightRunners.CumulativeLayoutShift.AnimationFailureReasons.UNSUPPORTED_CSS_PROPERTY,
+            Models.CLSCulprits.AnimationFailureReasons.TARGET_HAS_INVALID_COMPOSITING_STATE,
+            Models.CLSCulprits.AnimationFailureReasons.UNSUPPORTED_CSS_PROPERTY,
           ],
           unsupportedProperties: ['top'],
           animation: top,
@@ -60,7 +60,7 @@ describeWithEnvironment('CumulativeLayoutShift', function() {
     it.skip('[crbug.com/370382177]: gets the correct non composited animations for shift', async function() {
       const {data, insights} = await processTrace(this, 'non-composited-animation-shift.json.gz');
       const firstNav = getFirstOrError(data.Meta.navigationsByNavigationId.values());
-      const insight = getInsightOrError('CumulativeLayoutShift', insights, firstNav);
+      const insight = getInsightOrError('CLSCulprits', insights, firstNav);
       const {shifts, animationFailures} = insight;
 
       const simpleAnimation = data.Animations.animations.find(animation => {
@@ -70,30 +70,30 @@ describeWithEnvironment('CumulativeLayoutShift', function() {
         return animation.args.data.beginEvent.args.data.displayName === 'top';
       });
 
-      const shiftAnimations: InsightRunners.CumulativeLayoutShift.NoncompositedAnimationFailure[] = [];
+      const shiftAnimations: Models.CLSCulprits.NoncompositedAnimationFailure[] = [];
       shifts.forEach(entry => {
         shiftAnimations.push(...entry.nonCompositedAnimations);
       });
-      const expectedWithShift: InsightRunners.CumulativeLayoutShift.NoncompositedAnimationFailure[] = [
+      const expectedWithShift: Models.CLSCulprits.NoncompositedAnimationFailure[] = [
         {
           name: 'simple-animation',
-          failureReasons: [InsightRunners.CumulativeLayoutShift.AnimationFailureReasons.UNSUPPORTED_CSS_PROPERTY],
+          failureReasons: [Models.CLSCulprits.AnimationFailureReasons.UNSUPPORTED_CSS_PROPERTY],
           unsupportedProperties: ['height', 'color', 'top'],
           animation: simpleAnimation,
         },
       ];
       assert.deepStrictEqual(shiftAnimations, expectedWithShift);
 
-      const expectedAll: InsightRunners.CumulativeLayoutShift.NoncompositedAnimationFailure[] = [
+      const expectedAll: Models.CLSCulprits.NoncompositedAnimationFailure[] = [
         {
           name: 'simple-animation',
-          failureReasons: [InsightRunners.CumulativeLayoutShift.AnimationFailureReasons.UNSUPPORTED_CSS_PROPERTY],
+          failureReasons: [Models.CLSCulprits.AnimationFailureReasons.UNSUPPORTED_CSS_PROPERTY],
           unsupportedProperties: ['height', 'color', 'top'],
           animation: simpleAnimation,
         },
         {
           name: 'top',
-          failureReasons: [InsightRunners.CumulativeLayoutShift.AnimationFailureReasons.UNSUPPORTED_CSS_PROPERTY],
+          failureReasons: [Models.CLSCulprits.AnimationFailureReasons.UNSUPPORTED_CSS_PROPERTY],
           unsupportedProperties: ['top'],
           animation: top,
         },
@@ -105,7 +105,7 @@ describeWithEnvironment('CumulativeLayoutShift', function() {
     it('returns no insights when there are no non-composited animations', async function() {
       const {data, insights} = await processTrace(this, 'lcp-images.json.gz');
       const firstNav = getFirstOrError(data.Meta.navigationsByNavigationId.values());
-      const insight = getInsightOrError('CumulativeLayoutShift', insights, firstNav);
+      const insight = getInsightOrError('CLSCulprits', insights, firstNav);
       const {animationFailures} = insight;
 
       assert.isEmpty(animationFailures);
@@ -115,7 +115,7 @@ describeWithEnvironment('CumulativeLayoutShift', function() {
     it('returns correct layout shifts', async function() {
       const {data, insights} = await processTrace(this, 'cls-single-frame.json.gz');
       const firstNav = getFirstOrError(data.Meta.navigationsByNavigationId.values());
-      const insight = getInsightOrError('CumulativeLayoutShift', insights, firstNav);
+      const insight = getInsightOrError('CLSCulprits', insights, firstNav);
       const {shifts} = insight;
 
       assert.exists(shifts);
@@ -127,7 +127,7 @@ describeWithEnvironment('CumulativeLayoutShift', function() {
         // Trace has a single iframe that gets created before the first layout shift and causes a layout shift.
         const {data, insights} = await processTrace(this, 'iframe-shift.json.gz');
         const firstNav = getFirstOrError(data.Meta.navigationsByNavigationId.values());
-        const insight = getInsightOrError('CumulativeLayoutShift', insights, firstNav);
+        const insight = getInsightOrError('CLSCulprits', insights, firstNav);
         const {shifts} = insight;
 
         assert.exists(shifts);
@@ -159,7 +159,7 @@ describeWithEnvironment('CumulativeLayoutShift', function() {
         // Trace has font load before the second layout shift.
         const {data, insights} = await processTrace(this, 'iframe-shift.json.gz');
         const firstNav = getFirstOrError(data.Meta.navigationsByNavigationId.values());
-        const insight = getInsightOrError('CumulativeLayoutShift', insights, firstNav);
+        const insight = getInsightOrError('CLSCulprits', insights, firstNav);
         const {shifts} = insight;
 
         assert.exists(shifts);
@@ -193,7 +193,7 @@ describeWithEnvironment('CumulativeLayoutShift', function() {
       it('handles potential unsized images root cause correctly', async function() {
         const {data, insights} = await processTrace(this, 'unsized-images.json.gz');
         const firstNav = getFirstOrError(data.Meta.navigationsByNavigationId.values());
-        const insight = getInsightOrError('CumulativeLayoutShift', insights, firstNav);
+        const insight = getInsightOrError('CLSCulprits', insights, firstNav);
         const {shifts} = insight;
         assert.exists(shifts);
         assert.strictEqual(shifts.size, 2);
@@ -217,7 +217,7 @@ describeWithEnvironment('CumulativeLayoutShift', function() {
     it('returns clusters correctly', async function() {
       const {data, insights} = await processTrace(this, 'iframe-shift.json.gz');
       const firstNav = getFirstOrError(data.Meta.navigationsByNavigationId.values());
-      const insight = getInsightOrError('CumulativeLayoutShift', insights, firstNav);
+      const insight = getInsightOrError('CLSCulprits', insights, firstNav);
       const {shifts, clusters} = insight;
 
       assert.exists(clusters);
@@ -233,7 +233,7 @@ describeWithEnvironment('CumulativeLayoutShift', function() {
 
     it('returns clusters correctly for non-navigations', async function() {
       const {insights} = await processTrace(this, 'cls-no-nav.json.gz');
-      const insight = getInsightOrError('CumulativeLayoutShift', insights);
+      const insight = getInsightOrError('CLSCulprits', insights);
       const {shifts, clusters} = insight;
 
       assert.exists(clusters);

…/trace/insights/CumulativeLayoutShift.ts …end/models/trace/insights/CLSCulprits.tsfront_end/models/trace/insights/CumulativeLayoutShift.ts renamed to front_end/models/trace/insights/CLSCulprits.ts front_end/models/trace/insights/CumulativeLayoutShift.ts renamed to front_end/models/trace/insights/CLSCulprits.ts

@@ -7,9 +7,9 @@ import type * as Protocol from '../../../generated/protocol.js';
 import * as Helpers from '../helpers/helpers.js';
 import * as Types from '../types/types.js';
 
-import type {InsightResult, InsightSetContext, RequiredData} from './types.js';
+import type {InsightModel, InsightSetContext, RequiredData} from './types.js';
 
-export type CLSInsightResult = InsightResult<{
+export type CLSCulpritsInsightModel = InsightModel<{
   animationFailures: readonly NoncompositedAnimationFailure[],
   shifts: Map<Types.Events.SyntheticLayoutShift, LayoutShiftRootCausesData>,
   clusters: Types.Events.SyntheticLayoutShiftCluster[],
@@ -406,7 +406,8 @@ function getFontRootCauses(
   return rootCausesByShift;
 }
 
-export function generateInsight(parsedTrace: RequiredData<typeof deps>, context: InsightSetContext): CLSInsightResult {
+export function generateInsight(
+    parsedTrace: RequiredData<typeof deps>, context: InsightSetContext): CLSCulpritsInsightModel {
   const isWithinContext = (event: Types.Events.Event): boolean => Helpers.Timing.eventIsInBounds(event, context.bounds);
 
   const compositeAnimationEvents = parsedTrace.Animations.animations.filter(isWithinContext);

front_end/models/trace/insights/Common.ts

@@ -6,10 +6,10 @@ import type * as Handlers from '../handlers/handlers.js';
 import * as Helpers from '../helpers/helpers.js';
 import type * as Types from '../types/types.js';
 
-import type {InsightResults, InsightSetContextWithNavigation, TraceInsightSets} from './types.js';
+import type {InsightModels, InsightSetContextWithNavigation, TraceInsightSets} from './types.js';
 
-export function getInsight<InsightName extends keyof InsightResults>(
-    insightName: InsightName, insights: TraceInsightSets|null, key: string|null): InsightResults[InsightName]|null {
+export function getInsight<InsightName extends keyof InsightModels>(
+    insightName: InsightName, insights: TraceInsightSets|null, key: string|null): InsightModels[InsightName]|null {
   if (!insights || !key) {
     return null;
   }
@@ -19,13 +19,13 @@ export function getInsight<InsightName extends keyof InsightResults>(
     return null;
   }
 
-  const insight = insightSets.data[insightName];
+  const insight = insightSets.model[insightName];
   if (insight instanceof Error) {
     return null;
   }
 
   // For some reason typescript won't narrow the type by removing Error, so do it manually.
-  return insight as InsightResults[InsightName];
+  return insight as InsightModels[InsightName];
 }
 
 /**