chrome-devtools-frontend 1.0.1367881 → 1.0.1380117

package/front_end/models/trace/handlers/SamplesHandler.ts

@@ -8,8 +8,6 @@ import * as CPUProfile from '../../cpu_profile/cpu_profile.js';
 import * as Helpers from '../helpers/helpers.js';
 import * as Types from '../types/types.js';
 
-import {HandlerState} from './types.js';
-
 const events = new Map<Types.Events.ProcessID, Map<Types.Events.ThreadID, Types.Events.Complete[]>>();
 
 const profilesInProcess = new Map<Types.Events.ProcessID, Map<Types.Events.ThreadID, ProfileData>>();
@@ -26,8 +24,6 @@ const entryToNode = new Map<Types.Events.Event, Helpers.TreeHelpers.TraceEntryNo
 // events matched by thread id.
 const preprocessedData = new Map<Types.Events.ProcessID, Map<Types.Events.ProfileID, PreprocessedData>>();
 
-let handlerState = HandlerState.UNINITIALIZED;
-
 function buildProfileCalls(): void {
   for (const [processId, profiles] of preprocessedData) {
     for (const [profileId, preProcessedData] of profiles) {
@@ -110,22 +106,9 @@ export function reset(): void {
   preprocessedData.clear();
   profilesInProcess.clear();
   entryToNode.clear();
-  handlerState = HandlerState.UNINITIALIZED;
-}
-
-export function initialize(): void {
-  if (handlerState !== HandlerState.UNINITIALIZED) {
-    throw new Error('Samples Handler was not reset');
-  }
-
-  handlerState = HandlerState.INITIALIZED;
 }
 
 export function handleEvent(event: Types.Events.Event): void {
-  if (handlerState !== HandlerState.INITIALIZED) {
-    throw new Error('Samples Handler is not initialized');
-  }
-
   /**
    * A fake trace event created to support CDP.Profiler.Profiles in the
    * trace engine.
@@ -201,19 +184,10 @@ export function handleEvent(event: Types.Events.Event): void {
 }
 
 export async function finalize(): Promise<void> {
-  if (handlerState !== HandlerState.INITIALIZED) {
-    throw new Error('Samples Handler is not initialized');
-  }
   buildProfileCalls();
-
-  handlerState = HandlerState.FINALIZED;
 }
 
 export function data(): SamplesHandlerData {
-  if (handlerState !== HandlerState.FINALIZED) {
-    throw new Error('Samples Handler is not finalized');
-  }
-
   return {
     profilesInProcess,
     entryToNode,

package/front_end/models/trace/handlers/ScreenshotsHandler.test.ts

@@ -28,7 +28,6 @@ describe('ScreenshotsHandler', function() {
     // and later we will pass events to the meta handler, otherwise the
     // screenshots handler will fail.
     Trace.Handlers.ModelHandlers.Meta.reset();
-    Trace.Handlers.ModelHandlers.Meta.initialize();
 
     Trace.Handlers.ModelHandlers.Screenshots.reset();
   });

package/front_end/models/trace/handlers/SelectorStatsHandler.ts

@@ -29,6 +29,9 @@ export function handleEvent(event: Types.Events.Event): void {
   }
 }
 
+export async function finalize(): Promise<void> {
+}
+
 export interface SelectorStatsData {
   dataForUpdateLayoutEvent: Map<Types.Events.UpdateLayoutTree, {
     timings: Types.Events.SelectorTiming[],

package/front_end/models/trace/handlers/ServerTimingsHandler.ts

@@ -7,19 +7,12 @@ import * as Helpers from '../helpers/helpers.js';
 import * as Types from '../types/types.js';
 
 import {data as networkData} from './NetworkRequestsHandler.js';
-import {type HandlerName, HandlerState} from './types.js';
+import type {HandlerName} from './types.js';
 
 const serverTimings: Types.Events.SyntheticServerTiming[] = [];
 
-let handlerState = HandlerState.UNINITIALIZED;
-
 export function reset(): void {
   serverTimings.length = 0;
-  handlerState = HandlerState.UNINITIALIZED;
-}
-
-export function initialize(): void {
-  handlerState = HandlerState.INITIALIZED;
 }
 
 export function handleEvent(_event: Types.Events.Event): void {
@@ -27,12 +20,8 @@ export function handleEvent(_event: Types.Events.Event): void {
 }
 
 export async function finalize(): Promise<void> {
-  if (handlerState !== HandlerState.INITIALIZED) {
-    throw new Error('Server Timings handler is not initialized');
-  }
   extractServerTimings();
   Helpers.Trace.sortTraceEventsInPlace(serverTimings);
-  handlerState = HandlerState.FINALIZED;
 }
 
 const RESPONSE_START_METRIC_NAME = 'response-start';
@@ -124,10 +113,6 @@ function createSyntheticServerTiming(
 }
 
 export function data(): {serverTimings: Types.Events.SyntheticServerTiming[]} {
-  if (handlerState !== HandlerState.FINALIZED) {
-    throw new Error('Server Timing handler is not finalized');
-  }
-
   return {
     serverTimings,
   };

package/front_end/models/trace/handlers/Threads.test.ts

@@ -2,7 +2,6 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
-import * as TimelineModel from '../../../models/timeline_model/timeline_model.js';
 import {describeWithEnvironment} from '../../../testing/EnvironmentHelpers.js';
 import {TraceLoader} from '../../../testing/TraceLoader.js';
 import * as Trace from '../trace.js';
@@ -40,7 +39,7 @@ describeWithEnvironment('Handler Threads helper', function() {
     // it takes the CDP Profile and wraps it in fake trace events, before then
     // passing that through to the new engine.
     const rawEvents = await TraceLoader.rawCPUProfile(this, 'node-fibonacci-website.cpuprofile.gz');
-    const events = TimelineModel.TimelineJSProfile.TimelineJSProfileProcessor.createFakeTraceFromCpuProfile(
+    const events = Trace.Extras.TimelineJSProfile.TimelineJSProfileProcessor.createFakeTraceFromCpuProfile(
         rawEvents,
         Trace.Types.Events.ThreadID(1),
     );

package/front_end/models/trace/handlers/UserInteractionsHandler.test.ts

@@ -8,7 +8,6 @@ import * as Trace from '../trace.js';
 async function processTrace(context: Mocha.Suite|Mocha.Context|null, path: string): Promise<void> {
   const traceEvents = await TraceLoader.rawEvents(context, path);
   Trace.Handlers.ModelHandlers.Meta.reset();
-  Trace.Handlers.ModelHandlers.Meta.initialize();
   for (const event of traceEvents) {
     Trace.Handlers.ModelHandlers.Meta.handleEvent(event);
     Trace.Handlers.ModelHandlers.UserInteractions.handleEvent(event);
@@ -19,7 +18,6 @@ async function processTrace(context: Mocha.Suite|Mocha.Context|null, path: strin
 
 beforeEach(() => {
   Trace.Handlers.ModelHandlers.Meta.reset();
-  Trace.Handlers.ModelHandlers.Meta.initialize();
 });
 
 describe('UserInteractionsHandler', function() {
@@ -43,23 +41,6 @@ describe('UserInteractionsHandler', function() {
     return event as unknown as Trace.Types.Events.SyntheticInteractionPair;
   }
 
-  describe('error handling', () => {
-    it('throws if not initialized', async () => {
-      Trace.Handlers.ModelHandlers.Meta.reset();
-      Trace.Handlers.ModelHandlers.Meta.initialize();
-
-      // Finalize the handler by calling data and then finalize on it.
-      Trace.Handlers.ModelHandlers.UserInteractions.data();
-      await Trace.Handlers.ModelHandlers.Meta.finalize();
-      await Trace.Handlers.ModelHandlers.UserInteractions.finalize();
-
-      assert.throws(() => {
-        const fakeEvent = {} as Trace.Types.Events.Event;
-        Trace.Handlers.ModelHandlers.UserInteractions.handleEvent(fakeEvent);
-      }, 'Handler is not initialized');
-    });
-  });
-
   it('returns all user interactions', async function() {
     const traceEvents = await TraceLoader.rawEvents(this, 'slow-interaction-button-click.json.gz');
     for (const event of traceEvents) {
@@ -67,11 +48,7 @@ describe('UserInteractionsHandler', function() {
     }
 
     const data = Trace.Handlers.ModelHandlers.UserInteractions.data();
-    const clicks = data.allEvents.filter(event => {
-      if (!event.args.data) {
-        return false;
-      }
-
+    const clicks = data.allEvents.filter(Trace.Types.Events.isEventTimingStart).filter(event => {
       return event.args.data.type === 'click';
     });
 
@@ -184,8 +161,8 @@ describe('UserInteractionsHandler', function() {
   it('detects correct events for a click and keydown interaction', async () => {
     await processTrace(this, 'slow-interaction-keydown.json.gz');
     const data = Trace.Handlers.ModelHandlers.UserInteractions.data();
-    const foundInteractions =
-        data.allEvents.filter(e => e.args.data && e.args.data.duration > 1 && e.args.data.interactionId);
+    const foundInteractions = data.allEvents.filter(Trace.Types.Events.isEventTimingStart)
+                                  .filter(e => e.args.data && e.args.data.duration > 1 && e.args.data.interactionId);
     // We expect there to be 3 interactions:
     // User clicks on input:
     // 1.pointerdown, 2. pointerup, 3. click
@@ -276,7 +253,7 @@ describe('UserInteractionsHandler', function() {
           },
         },
       },
-    ] as unknown as Trace.Types.Events.EventTiming[];
+    ] as unknown as Trace.Types.Events.EventTimingBeginOrEnd[];
     Trace.Handlers.ModelHandlers.UserInteractions.reset();
     for (const event of events) {
       Trace.Handlers.ModelHandlers.UserInteractions.handleEvent(event);

package/front_end/models/trace/handlers/UserInteractionsHandler.ts

@@ -7,7 +7,7 @@ import * as Types from '../types/types.js';
 
 import {data as metaHandlerData} from './MetaHandler.js';
 import {ScoreClassification} from './PageLoadMetricsHandler.js';
-import {type HandlerName, HandlerState} from './types.js';
+import type {HandlerName} from './types.js';
 
 // This handler serves two purposes. It generates a list of events that are
 // used to show user clicks in the timeline. It is also used to gather
@@ -16,7 +16,7 @@ import {type HandlerName, HandlerState} from './types.js';
 
 // We don't need to know which process / thread these events occurred in,
 // because they are effectively global, so we just track all that we find.
-const allEvents: Types.Events.EventTiming[] = [];
+const allEvents: Types.Events.EventTimingBeginOrEnd[] = [];
 
 const beginCommitCompositorFrameEvents: Types.Events.BeginCommitCompositorFrame[] = [];
 const parseMetaViewportEvents: Types.Events.ParseMetaViewport[] = [];
@@ -28,7 +28,7 @@ const INP_MEDIUM_TIMING = Helpers.Timing.millisecondsToMicroseconds(Types.Timing
 
 export interface UserInteractionsData {
   /** All the user events we found in the trace */
-  allEvents: readonly Types.Events.EventTiming[];
+  allEvents: readonly Types.Events.EventTimingBeginOrEnd[];
   /** All the BeginCommitCompositorFrame events we found in the trace */
   beginCommitCompositorFrameEvents: readonly Types.Events.BeginCommitCompositorFrame[];
   /** All the ParseMetaViewport events we found in the trace */
@@ -64,7 +64,6 @@ const interactionEvents: Types.Events.SyntheticInteractionPair[] = [];
 const interactionEventsWithNoNesting: Types.Events.SyntheticInteractionPair[] = [];
 const eventTimingEndEventsById = new Map<string, Types.Events.EventTimingEnd>();
 const eventTimingStartEventsForInteractions: Types.Events.EventTimingBegin[] = [];
-let handlerState = HandlerState.UNINITIALIZED;
 
 export function reset(): void {
   allEvents.length = 0;
@@ -75,14 +74,9 @@ export function reset(): void {
   eventTimingEndEventsById.clear();
   interactionEventsWithNoNesting.length = 0;
   longestInteractionEvent = null;
-  handlerState = HandlerState.INITIALIZED;
 }
 
 export function handleEvent(event: Types.Events.Event): void {
-  if (handlerState !== HandlerState.INITIALIZED) {
-    throw new Error('Handler is not initialized');
-  }
-
   if (Types.Events.isBeginCommitCompositorFrame(event)) {
     beginCommitCompositorFrameEvents.push(event);
     return;
@@ -279,18 +273,16 @@ export async function finalize(): Promise<void> {
       // If we cannot find an end event, bail and drop this event.
       continue;
     }
-    if (!interactionStartEvent.args.data?.type || !interactionStartEvent.args.data?.interactionId) {
-      // A valid interaction event that we care about has to have a type (e.g.
-      // pointerdown, keyup).
-      //
-      // We also need to ensure it has an interactionId. We already checked
-      // this in the handleEvent() function, but we do it here also to satisfy
-      // TypeScript.
+    const {type, interactionId, timeStamp, processingStart, processingEnd} = interactionStartEvent.args.data;
+    if (!type || !interactionId || !timeStamp || !processingStart || !processingEnd) {
+      // A valid interaction event that we care about has to have a type (e.g. pointerdown, keyup).
+      // We also need to ensure it has an interactionId and various timings. There are edge cases where these aren't included in the trace event.
       continue;
     }
 
-    // In the future we will add microsecond timestamps to the trace events,
-    // but until then we can use the millisecond precision values that are in
+    // In the future we will add microsecond timestamps to the trace events…
+    // (See https://source.chromium.org/chromium/chromium/src/+/main:third_party/blink/renderer/core/timing/window_performance.cc;l=900-901;drc=b503c262e425eae59ced4a80d59d176ed07152c7 )
+    // …but until then we can use the millisecond precision values that are in
     // the trace event. To adjust them to be relative to the event.ts and the
     // trace timestamps, for both processingStart and processingEnd we subtract
     // the event timestamp (NOT event.ts, but the timeStamp millisecond value
@@ -299,17 +291,17 @@ export async function finalize(): Promise<void> {
     // that is relative to event.ts, and can be used when drawing boxes.
     // There is some inaccuracy here as we are converting milliseconds to microseconds, but it is good enough until the backend emits more accurate numbers.
     const processingStartRelativeToTraceTime = Types.Timing.MicroSeconds(
-        Helpers.Timing.millisecondsToMicroseconds(interactionStartEvent.args.data.processingStart) -
-            Helpers.Timing.millisecondsToMicroseconds(interactionStartEvent.args.data.timeStamp) +
-            interactionStartEvent.ts,
+        Helpers.Timing.millisecondsToMicroseconds(processingStart) -
+            Helpers.Timing.millisecondsToMicroseconds(timeStamp) + interactionStartEvent.ts,
     );
 
     const processingEndRelativeToTraceTime = Types.Timing.MicroSeconds(
-        (Helpers.Timing.millisecondsToMicroseconds(interactionStartEvent.args.data.processingEnd) -
-         Helpers.Timing.millisecondsToMicroseconds(interactionStartEvent.args.data.timeStamp)) +
+        (Helpers.Timing.millisecondsToMicroseconds(processingEnd) -
+         Helpers.Timing.millisecondsToMicroseconds(timeStamp)) +
         interactionStartEvent.ts);
 
-    const frameId = interactionStartEvent.args.frame ?? interactionStartEvent.args.data.frame;
+    // Ultimate frameId fallback only needed for TSC, see comments in the type.
+    const frameId = interactionStartEvent.args.frame ?? interactionStartEvent.args.data.frame ?? '';
     const navigation = Helpers.Trace.getNavigationForTraceEvent(interactionStartEvent, frameId, navigationsByFrameId);
     const navigationId = navigation?.args.data?.navigationId;
     const interactionEvent =
@@ -345,7 +337,6 @@ export async function finalize(): Promise<void> {
     interactionEvents.push(interactionEvent);
   }
 
-  handlerState = HandlerState.FINALIZED;
   interactionEventsWithNoNesting.push(...removeNestedInteractions(interactionEvents));
 
   // Pick the longest interactions from the set that were not nested, as we

package/front_end/models/trace/handlers/UserTimingsHandler.ts

@@ -5,8 +5,6 @@
 import * as Helpers from '../helpers/helpers.js';
 import * as Types from '../types/types.js';
 
-import {HandlerState} from './types.js';
-
 /**
  * IMPORTANT!
  * See UserTimings.md in this directory for some handy documentation on
@@ -43,7 +41,6 @@ export interface UserTimingsData {
    */
   timestampEvents: readonly Types.Events.TimeStamp[];
 }
-let handlerState = HandlerState.UNINITIALIZED;
 
 export function reset(): void {
   syntheticEvents.length = 0;
@@ -51,7 +48,6 @@ export function reset(): void {
   performanceMarkEvents.length = 0;
   consoleTimings.length = 0;
   timestampEvents.length = 0;
-  handlerState = HandlerState.INITIALIZED;
 }
 
 const resourceTimingNames = [
@@ -143,10 +139,6 @@ function userTimingComparator(
 }
 
 export function handleEvent(event: Types.Events.Event): void {
-  if (handlerState !== HandlerState.INITIALIZED) {
-    throw new Error('UserTimings handler is not initialized');
-  }
-
   if (ignoredNames.includes(event.name)) {
     return;
   }
@@ -167,21 +159,12 @@ export function handleEvent(event: Types.Events.Event): void {
 }
 
 export async function finalize(): Promise<void> {
-  if (handlerState !== HandlerState.INITIALIZED) {
-    throw new Error('UserTimings handler is not initialized');
-  }
-
   const asyncEvents = [...performanceMeasureEvents, ...consoleTimings];
   syntheticEvents = Helpers.Trace.createMatchedSortedSyntheticEvents(asyncEvents);
   syntheticEvents = syntheticEvents.sort((a, b) => userTimingComparator(a, b, [...syntheticEvents]));
-  handlerState = HandlerState.FINALIZED;
 }
 
 export function data(): UserTimingsData {
-  if (handlerState !== HandlerState.FINALIZED) {
-    throw new Error('UserTimings handler is not finalized');
-  }
-
   return {
     performanceMeasures: syntheticEvents.filter(e => e.cat === 'blink.user_timing') as
         Types.Events.SyntheticUserTimingPair[],

package/front_end/models/trace/handlers/WorkersHandler.test.ts

@@ -9,7 +9,6 @@ describe('WorkersHandler', () => {
   beforeEach(async function() {
     Trace.Handlers.ModelHandlers.Workers.reset();
     const events = await TraceLoader.rawEvents(this, 'two-workers.json.gz');
-    Trace.Handlers.ModelHandlers.Workers.initialize();
     for (const event of events) {
       Trace.Handlers.ModelHandlers.Workers.handleEvent(event);
     }

package/front_end/models/trace/handlers/WorkersHandler.ts

@@ -4,47 +4,29 @@
 
 import * as Types from '../types/types.js';
 
-import {HandlerState} from './types.js';
-
 export interface WorkersData {
   workerSessionIdEvents: readonly Types.Events.TracingSessionIdForWorker[];
   workerIdByThread: Map<Types.Events.ThreadID, Types.Events.WorkerId>;
   workerURLById: Map<Types.Events.WorkerId, string>;
 }
-let handlerState = HandlerState.UNINITIALIZED;
 
 const sessionIdEvents: Types.Events.TracingSessionIdForWorker[] = [];
 const workerIdByThread: Map<Types.Events.ThreadID, Types.Events.WorkerId> = new Map();
 const workerURLById: Map<Types.Events.WorkerId, string> = new Map();
 
-export function initialize(): void {
-  if (handlerState !== HandlerState.UNINITIALIZED) {
-    throw new Error('Workers Handler was not reset');
-  }
-
-  handlerState = HandlerState.INITIALIZED;
-}
-
 export function reset(): void {
   sessionIdEvents.length = 0;
   workerIdByThread.clear();
   workerURLById.clear();
-  handlerState = HandlerState.UNINITIALIZED;
 }
 
 export function handleEvent(event: Types.Events.Event): void {
-  if (handlerState !== HandlerState.INITIALIZED) {
-    throw new Error('Workers Handler is not initialized');
-  }
   if (Types.Events.isTracingSessionIdForWorker(event)) {
     sessionIdEvents.push(event);
   }
 }
 
 export async function finalize(): Promise<void> {
-  if (handlerState !== HandlerState.INITIALIZED) {
-    throw new Error('Handler is not initialized');
-  }
   for (const sessionIdEvent of sessionIdEvents) {
     if (!sessionIdEvent.args.data) {
       continue;
@@ -52,14 +34,9 @@ export async function finalize(): Promise<void> {
     workerIdByThread.set(sessionIdEvent.args.data.workerThreadId, sessionIdEvent.args.data.workerId);
     workerURLById.set(sessionIdEvent.args.data.workerId, sessionIdEvent.args.data.url);
   }
-  handlerState = HandlerState.FINALIZED;
 }
 
 export function data(): WorkersData {
-  if (handlerState !== HandlerState.FINALIZED) {
-    throw new Error('Workers Handler is not finalized');
-  }
-
   return {
     workerSessionIdEvents: sessionIdEvents,
     workerIdByThread,

package/front_end/models/trace/handlers/types.ts

@@ -7,9 +7,8 @@ import type * as ModelHandlers from './ModelHandlers.js';
 
 export interface Handler {
   reset(): void;
-  initialize?(freshRecording?: boolean): void;
   handleEvent(data: {}): void;
-  finalize?(): Promise<void>;
+  finalize(): Promise<void>;
   data(): unknown;
   deps?(): HandlerName[];
   handleUserConfig?(config: Types.Configuration.Configuration): void;
@@ -65,9 +64,3 @@ type DeepWriteable<T> = {
 export type ParsedTraceMutable = DeepWriteable<ParsedTrace>;
 
 export type Handlers = typeof ModelHandlers;
-
-export const enum HandlerState {
-  UNINITIALIZED = 1,
-  INITIALIZED = 2,
-  FINALIZED = 3,
-}

package/front_end/models/trace/helpers/Timing.test.ts

@@ -3,6 +3,7 @@
 // found in the LICENSE file.
 
 import {describeWithEnvironment} from '../../../testing/EnvironmentHelpers.js';
+import {microsecondsTraceWindow} from '../../../testing/TraceHelpers.js';
 import {TraceLoader} from '../../../testing/TraceLoader.js';
 import * as Trace from '../trace.js';
 
@@ -351,4 +352,32 @@ describeWithEnvironment('Timing helpers', () => {
       assert.isFalse(timestampIsInBounds(bounds, MicroSeconds(11)));
     });
   });
+
+  describe('WindowFitsInsideBounds', () => {
+    const {windowFitsInsideBounds} = Trace.Helpers.Timing;
+    const {MicroSeconds} = Trace.Types.Timing;
+
+    const bounds: Trace.Types.Timing.TraceWindowMicroSeconds = {
+      min: MicroSeconds(5),
+      max: MicroSeconds(15),
+      range: MicroSeconds(10),
+    };
+
+    it('is true if the window fits within the bounds', () => {
+      assert.isTrue(windowFitsInsideBounds({window: microsecondsTraceWindow(5, 8), bounds}));
+      assert.isTrue(windowFitsInsideBounds({window: microsecondsTraceWindow(5, 14), bounds}));
+      assert.isTrue(windowFitsInsideBounds({window: microsecondsTraceWindow(5, 15), bounds}));
+    });
+
+    it('is false if the window does not fully fit within the bounds', () => {
+      // Outside the left hand edge
+      assert.isFalse(windowFitsInsideBounds({window: microsecondsTraceWindow(0, 8), bounds}));
+      // Outside the right hand edge
+      assert.isFalse(windowFitsInsideBounds({window: microsecondsTraceWindow(10, 20), bounds}));
+      // Outside entirely before
+      assert.isFalse(windowFitsInsideBounds({window: microsecondsTraceWindow(0, 5), bounds}));
+      // Outside entirely after
+      assert.isFalse(windowFitsInsideBounds({window: microsecondsTraceWindow(20, 25), bounds}));
+    });
+  });
 });

package/front_end/models/trace/helpers/Timing.ts

@@ -118,6 +118,14 @@ export function traceWindowMillisecondsToMicroSeconds(bounds: Types.Timing.Trace
     range: millisecondsToMicroseconds(bounds.range),
   };
 }
+export function traceWindowMicroSecondsToMilliSeconds(bounds: Types.Timing.TraceWindowMicroSeconds):
+    Types.Timing.TraceWindowMilliSeconds {
+  return {
+    min: microSecondsToMilliseconds(bounds.min),
+    max: microSecondsToMilliseconds(bounds.max),
+    range: microSecondsToMilliseconds(bounds.range),
+  };
+}
 
 export function traceWindowFromMilliSeconds(
     min: Types.Timing.MilliSeconds, max: Types.Timing.MilliSeconds): Types.Timing.TraceWindowMicroSeconds {
@@ -178,6 +186,16 @@ export interface WindowFitsInsideBounds {
   window: Types.Timing.TraceWindowMicroSeconds;
   bounds: Types.Timing.TraceWindowMicroSeconds;
 }
+
+/**
+ * Returns true if the window fits entirely within the bounds.
+ * Note that if the window is equivalent to the bounds, that is considered to fit
+ */
 export function windowFitsInsideBounds(data: WindowFitsInsideBounds): boolean {
   return data.window.min >= data.bounds.min && data.window.max <= data.bounds.max;
 }
+
+export function windowsEqual(
+    w1: Types.Timing.TraceWindowMicroSeconds, w2: Types.Timing.TraceWindowMicroSeconds): boolean {
+  return w1.min === w2.min && w1.max === w2.max;
+}

package/front_end/models/trace/helpers/TreeHelpers.test.ts

@@ -462,49 +462,67 @@ describe('TreeHelpers', () => {
       const parseFunction = makeCompleteEvent('V8.ParseFunction', 12, 1);
 
       const traceEvents: Trace.Types.Events.Event[] = [evaluateScript, v8Run, parseFunction];
-
       const profileCalls = [makeProfileCall('a', 100, 200), makeProfileCall('b', 300, 200)];
+
+      // Roughly this looks like:
+      // 0                                          500
+      // |------------- EvaluateScript -------------|
+      //  |-        v8.run                         -|
+      //    |--|   |-    a   -||-          b        |
+      //      ^ V8.ParseFunction
+
       const allEntries = Trace.Helpers.Trace.mergeEventsInOrder(traceEvents, profileCalls);
       const {tree, entryToNode} = Trace.Helpers.TreeHelpers.treify(allEntries, {filter: {has: () => true}});
       const rootNode = entryToNode.get(evaluateScript);
-      const selectedNode = entryToNode.get(parseFunction);
+      // Select something from the middle.
+      const selectedNode = entryToNode.get(v8Run);
 
       assert.strictEqual(tree.roots.size, 1);
       assert.exists(rootNode);
       assert.exists(selectedNode);
 
-      const traceEntryTreeForAI = Trace.Helpers.TreeHelpers.TraceEntryNodeForAI.fromSelectedEntryNode(selectedNode);
-      const actualSelectedNode =
-          Trace.Helpers.TreeHelpers.TraceEntryNodeForAI.getSelectedNodeForTraceEntryTreeForAI(traceEntryTreeForAI);
-
-      assert.exists(traceEntryTreeForAI);
-      assert.exists(actualSelectedNode);
-
-      // delete for smaller deepStrictEqual comparison
-      actualSelectedNode.children = traceEntryTreeForAI.children = [];
-
-      const expectedTraceEntryTree = new Trace.Helpers.TreeHelpers.TraceEntryNodeForAI(
-          'EvaluateScript',
-          Trace.Types.Timing.MilliSeconds(0),
-          Trace.Types.Timing.MilliSeconds(0.5),
-          undefined,
-          Trace.Types.Timing.MilliSeconds(0.01),
-      );
-      expectedTraceEntryTree.id = 0 as Trace.Helpers.TreeHelpers.TraceEntryNodeId;
-      expectedTraceEntryTree.children = [];
-      assert.deepStrictEqual(traceEntryTreeForAI, expectedTraceEntryTree);
-
-      const expectedselectedNodeForAI = new Trace.Helpers.TreeHelpers.TraceEntryNodeForAI(
-          'V8.ParseFunction',
-          Trace.Types.Timing.MilliSeconds(0.012),
-          Trace.Types.Timing.MilliSeconds(0.001),
-          undefined,
-          Trace.Types.Timing.MilliSeconds(0.001),
-      );
-      expectedselectedNodeForAI.id = 2 as Trace.Helpers.TreeHelpers.TraceEntryNodeId;
-      expectedselectedNodeForAI.children = [];
-      expectedselectedNodeForAI.selected = true;
-      assert.deepStrictEqual(actualSelectedNode, expectedselectedNodeForAI);
+      const aiNodeTree = Trace.Helpers.TreeHelpers.AINode.fromEntryNode(selectedNode, () => true);
+      const v8RunNode = Trace.Helpers.TreeHelpers.AINode.getSelectedNodeWithinTree(aiNodeTree);
+
+      assert.exists(aiNodeTree);
+      assert.exists(v8RunNode);
+
+      // First check the serialization as a while.
+      assert.deepStrictEqual(JSON.parse(JSON.stringify(aiNodeTree)), {
+        name: 'EvaluateScript',
+        dur: 0.5,
+        self: 0,
+        children: [{
+          selected: true,
+          name: 'v8.run',
+          dur: 0.5,
+          self: 0.1,
+          children: [
+            {name: 'V8.ParseFunction', dur: 0, self: 0},
+            {name: 'a', url: '', dur: 0.2, self: 0.2},
+            {name: 'b', url: '', dur: 0.2, self: 0.2},
+          ],
+        }],
+      });
+
+      // Now we can make sure the pre-serialized data is also correct.
+      assert.strictEqual(v8RunNode.name, 'v8.run');
+      assert.strictEqual(v8RunNode.selected, true);
+      assert.strictEqual(v8RunNode.duration, 0.49);
+      assert.strictEqual(v8RunNode.children?.length, 3);
+
+      assert.strictEqual(aiNodeTree.name, 'EvaluateScript');
+      assert.strictEqual(aiNodeTree.selected, undefined);
+      assert.strictEqual(aiNodeTree.duration, 0.5);
+      assert.strictEqual(aiNodeTree.children?.length, 1);
+
+      const parseFnAINode = v8RunNode.children?.at(0) as Trace.Helpers.TreeHelpers.AINode;
+      assert.exists(v8RunNode);
+
+      assert.strictEqual(parseFnAINode.name, 'V8.ParseFunction');
+      assert.strictEqual(parseFnAINode.selected, undefined);
+      assert.strictEqual(parseFnAINode.duration, 0.001);
+      assert.strictEqual(parseFnAINode.children, undefined);
     });
   });
 });