chrome-devtools-frontend 1.0.1402249 → 1.0.1418433

package/front_end/panels/timeline/TimelineUIUtils.test.ts

@@ -3,15 +3,14 @@
 // found in the LICENSE file.
 
 import * as Common from '../../core/common/common.js';
-import type * as Platform from '../../core/platform/platform.js';
+import * as Platform from '../../core/platform/platform.js';
 import * as SDK from '../../core/sdk/sdk.js';
 import type * as Protocol from '../../generated/protocol.js';
 import * as Bindings from '../../models/bindings/bindings.js';
 import * as Trace from '../../models/trace/trace.js';
 import * as Workspace from '../../models/workspace/workspace.js';
-import * as Elements from '../../panels/elements/elements.js';
 import {doubleRaf, renderElementIntoDOM} from '../../testing/DOMHelpers.js';
-import {createTarget} from '../../testing/EnvironmentHelpers.js';
+import {createTarget, deinitializeGlobalVars, initializeGlobalVars} from '../../testing/EnvironmentHelpers.js';
 import {
   clearMockConnectionResponseHandler,
   describeWithMockConnection,
@@ -37,7 +36,15 @@ import * as ThemeSupport from '../../ui/legacy/theme_support/theme_support.js';
 import * as Timeline from './timeline.js';
 import * as Utils from './utils/utils.js';
 
+const {urlString} = Platform.DevToolsPath;
+
 describeWithMockConnection('TimelineUIUtils', function() {
+  before(async () => {
+    await initializeGlobalVars();
+  });
+
+  after(async () => await deinitializeGlobalVars());
+
   let target: SDK.Target.Target;
   // Trace events contain script ids as strings. However, the linkifier
   // utilities assume it is a number because that's how it's defined at
@@ -93,8 +100,8 @@ describeWithMockConnection('TimelineUIUtils', function() {
            name: Trace.Types.Events.Name.FUNCTION_CALL,
            ph: Trace.Types.Events.Phase.COMPLETE,
            cat: 'devtools-timeline',
-           dur: Trace.Types.Timing.MicroSeconds(100),
-           ts: Trace.Types.Timing.MicroSeconds(100),
+           dur: Trace.Types.Timing.Micro(100),
+           ts: Trace.Types.Timing.Micro(100),
            pid: Trace.Types.Events.ProcessID(1),
            tid: Trace.Types.Events.ThreadID(1),
            args: {
@@ -108,7 +115,7 @@ describeWithMockConnection('TimelineUIUtils', function() {
            },
          };
 
-         target.setInspectedURL('https://not-google.com' as Platform.DevToolsPath.UrlString);
+         target.setInspectedURL(urlString`https://not-google.com`);
          const node = await Timeline.TimelineUIUtils.TimelineUIUtils.buildDetailsNodeForTraceEvent(
              fakeFunctionCall, target, new Components.Linkifier.Linkifier(), false, parsedTrace);
          if (!node) {
@@ -126,8 +133,8 @@ describeWithMockConnection('TimelineUIUtils', function() {
            name: Trace.Types.Events.Name.FUNCTION_CALL,
            ph: Trace.Types.Events.Phase.COMPLETE,
            cat: 'devtools-timeline',
-           dur: Trace.Types.Timing.MicroSeconds(100),
-           ts: Trace.Types.Timing.MicroSeconds(100),
+           dur: Trace.Types.Timing.Micro(100),
+           ts: Trace.Types.Timing.Micro(100),
            pid: Trace.Types.Events.ProcessID(1),
            tid: Trace.Types.Events.ThreadID(1),
            args: {
@@ -140,7 +147,7 @@ describeWithMockConnection('TimelineUIUtils', function() {
              },
            },
          };
-         target.setInspectedURL('https://google.com' as Platform.DevToolsPath.UrlString);
+         target.setInspectedURL(urlString`https://google.com`);
          const node = await Timeline.TimelineUIUtils.TimelineUIUtils.buildDetailsNodeForTraceEvent(
              fakeFunctionCall, target, new Components.Linkifier.Linkifier(), false, parsedTrace);
          if (!node) {
@@ -165,9 +172,9 @@ describeWithMockConnection('TimelineUIUtils', function() {
         mappings: 'AAAA,SAASA,EAAWC,EAAMC,GACxBC,QAAQC,IAAIH,EAAMC',
       });
       setupPageResourceLoaderForSourceMap(sourceMapContent);
-      target.setInspectedURL('https://google.com' as Platform.DevToolsPath.UrlString);
-      const scriptUrl = 'https://google.com/script.js' as Platform.DevToolsPath.UrlString;
-      const sourceMapUrl = 'script.js.map' as Platform.DevToolsPath.UrlString;
+      target.setInspectedURL(urlString`https://google.com`);
+      const scriptUrl = urlString`https://google.com/script.js`;
+      const sourceMapUrl = urlString`script.js.map`;
       const debuggerModel = target.model(SDK.DebuggerModel.DebuggerModel);
       assert.isNotNull(debuggerModel);
       if (debuggerModel === null) {
@@ -261,11 +268,7 @@ describeWithMockConnection('TimelineUIUtils', function() {
       await resolver.install();
 
       const details = await Timeline.TimelineUIUtils.TimelineUIUtils.buildTraceEventDetails(
-          parsedTrace,
-          profileCall,
-          new Components.Linkifier.Linkifier(),
-          false,
-      );
+          parsedTrace, profileCall, new Components.Linkifier.Linkifier(), false, null);
       const stackTraceData = getStackTraceForDetailsElement(details);
       assert.exists(stackTraceData);
       assert.isTrue(stackTraceData[0].startsWith('someFunction @'));
@@ -318,8 +321,9 @@ describeWithMockConnection('TimelineUIUtils', function() {
           functionCall,
           new Components.Linkifier.Linkifier(),
           false,
+          null,
       );
-      const detailsData = getRowDataForDetailsElement(details).at(0);
+      const detailsData = getRowDataForDetailsElement(details).find(row => row.title?.startsWith('Function'));
       assert.exists(detailsData);
       assert.deepEqual(detailsData, {title: 'Function', value: 'someFunction @ gen.js:1:52'});
     });
@@ -341,8 +345,8 @@ describeWithMockConnection('TimelineUIUtils', function() {
 
       // Round the time to 2DP to avoid needlessly long expectation numbers!
       const unadjustedStartTimeMilliseconds = Trace.Helpers.Timing
-                                                  .microSecondsToMilliseconds(
-                                                      Trace.Types.Timing.MicroSeconds(dclEvent.ts - traceMinBound),
+                                                  .microToMilli(
+                                                      Trace.Types.Timing.Micro(dclEvent.ts - traceMinBound),
                                                       )
                                                   .toFixed(2);
       assert.strictEqual(unadjustedStartTimeMilliseconds, String(190.79));
@@ -504,6 +508,7 @@ describeWithMockConnection('TimelineUIUtils', function() {
           task,
           new Components.Linkifier.Linkifier(),
           false,
+          null,
       );
       const titleSwatch: HTMLElement|null = details.querySelector('.timeline-details-chip-title div');
       assert.strictEqual(titleSwatch?.style.backgroundColor, 'rgb(10, 10, 10)');
@@ -545,6 +550,7 @@ describeWithMockConnection('TimelineUIUtils', function() {
           interactionEvent,
           new Components.Linkifier.Linkifier(),
           false,
+          null,
       );
       const rowData = getRowDataForDetailsElement(details);
       assert.deepEqual(rowData, [
@@ -552,6 +558,7 @@ describeWithMockConnection('TimelineUIUtils', function() {
           title: 'Warning',
           value: 'Long interaction is indicating poor page responsiveness.',
         },
+        {title: 'Duration', value: '979.97\xA0ms'},
         {
           title: 'ID',
           value: '4122',
@@ -584,9 +591,11 @@ describeWithMockConnection('TimelineUIUtils', function() {
           event,
           new Components.Linkifier.Linkifier(),
           false,
+          null,
       );
       const rowData = getRowDataForDetailsElement(details);
       assert.deepEqual(rowData, [
+        {title: 'Duration', value: '0.22\xA0ms (self 0.20\xA0ms)'},
         {
           title: '',
           // Generic traces get their events rendered as JSON
@@ -624,9 +633,11 @@ describeWithMockConnection('TimelineUIUtils', function() {
           updateLayoutTreeEvent,
           new Components.Linkifier.Linkifier(),
           false,
+          null,
       );
       const rowData = getRowDataForDetailsElement(details);
       assert.deepEqual(rowData, [
+        {title: 'Duration', value: '0.19\xA0ms'},
         {
           title: 'Elements affected',
           value: '3',
@@ -685,6 +696,7 @@ describeWithMockConnection('TimelineUIUtils', function() {
           mark,
           new Components.Linkifier.Linkifier(),
           false,
+          null,
       );
       const rowData = getRowDataForDetailsElement(details);
       assert.deepEqual(rowData, [
@@ -707,6 +719,7 @@ describeWithMockConnection('TimelineUIUtils', function() {
           measure,
           new Components.Linkifier.Linkifier(),
           false,
+          null,
       );
       const rowData = getRowDataForDetailsElement(details);
       assert.deepEqual(rowData, [
@@ -714,6 +727,7 @@ describeWithMockConnection('TimelineUIUtils', function() {
           title: 'Timestamp',
           value: '1,005.5\xA0ms',
         },
+        {title: 'Duration', value: '500.00\xA0ms'},
         {
           title: 'Details',
           value:
@@ -734,9 +748,11 @@ describeWithMockConnection('TimelineUIUtils', function() {
           compileEvent,
           new Components.Linkifier.Linkifier(),
           false,
+          null,
       );
       const rowData = getRowDataForDetailsElement(details);
       assert.deepEqual(rowData, [
+        {title: 'Duration', value: '0.98\xA0ms (self 34\xA0μs)'},
         {
           title: 'Script',
           // URL plus line/col number
@@ -750,73 +766,6 @@ describeWithMockConnection('TimelineUIUtils', function() {
       ]);
     });
 
-    it('renders the details for a layout shift properly', async function() {
-      // Set related CDP methods responses to return our mock document and node.
-      const domModel = target.model(SDK.DOMModel.DOMModel);
-      assert.exists(domModel);
-      const documentNode = {nodeId: 1 as Protocol.DOM.NodeId};
-      const docc = new SDK.DOMModel.DOMNode(domModel) as SDK.DOMModel.DOMDocument;
-      const domNode2 = new SDK.DOMModel.DOMNode(domModel);
-      const domID = 58 as Protocol.DOM.NodeId;
-      domNode2.id = domID;
-
-      setMockConnectionResponseHandler('DOM.pushNodesByBackendIdsToFrontend', () => ({nodeIds: [domID]}));
-
-      setMockConnectionResponseHandler('DOM.getDocument', () => ({root: documentNode}));
-      await domModel.requestDocument();
-      domModel.registerNode(domNode2);
-      domNode2.init(docc, false, {nodeName: 'A test node name', nodeId: domID} as Protocol.DOM.Node);
-      const {parsedTrace} = await TraceLoader.traceEngine(this, 'cls-single-frame.json.gz');
-      const layoutShift = parsedTrace.LayoutShifts.clusters[0].events[0];
-      Common.Linkifier.registerLinkifier({
-        contextTypes() {
-          return [Timeline.CLSLinkifier.CLSRect];
-        },
-        async loadLinkifier() {
-          return Timeline.CLSLinkifier.Linkifier.instance();
-        },
-      });
-      Common.Linkifier.registerLinkifier({
-        contextTypes() {
-          return [
-            SDK.DOMModel.DOMNode,
-          ];
-        },
-        async loadLinkifier() {
-          return Elements.DOMLinkifier.Linkifier.instance();
-        },
-      });
-
-      if (!layoutShift) {
-        throw new Error('Could not find LayoutShift event.');
-      }
-
-      const details = await Timeline.TimelineUIUtils.TimelineUIUtils.buildTraceEventDetails(
-          parsedTrace,
-          layoutShift,
-          new Components.Linkifier.Linkifier(),
-          false,
-      );
-      const rowData = getRowDataForDetailsElement(details);
-      assert.deepEqual(
-          rowData,
-          [
-            {
-              title: 'Warning',
-              value: 'Cumulative Layout Shifts can result in poor user experiences. It has recently evolved.',
-            },
-            {title: 'Score', value: '0.04218'},
-            {title: 'Cumulative score', value: '0.04218'},
-            {title: 'Current cluster ID', value: '1'},
-            {title: 'Current cluster score', value: '0.2952'},
-            {title: 'Had recent input', value: 'No'},
-            {title: 'Moved from', value: 'Location: [120,670], Size: [900x900]'},
-            {title: 'Moved to', value: 'Location: [120,1270], Size: [900x478]'},
-            {title: 'Related node', value: 'A test node name'},
-          ],
-      );
-    });
-
     it('renders the details for an extension entry properly', async function() {
       const {parsedTrace} = await TraceLoader.traceEngine(this, 'extension-tracks-and-marks.json.gz');
       const extensionEntry =
@@ -831,11 +780,13 @@ describeWithMockConnection('TimelineUIUtils', function() {
           extensionEntry,
           new Components.Linkifier.Linkifier(),
           false,
+          null,
       );
-      const rowData = getRowDataForDetailsElement(details).slice(0, 2);
+      const rowData = getRowDataForDetailsElement(details).slice(0, 3);
       assert.deepEqual(
           rowData,
           [
+            {title: 'Duration', value: '1.00\xA0s (self 400.50\xA0ms)'},
             {
               title: 'Description',
               value: 'This is a child task',
@@ -858,14 +809,15 @@ describeWithMockConnection('TimelineUIUtils', function() {
           extensionMark,
           new Components.Linkifier.Linkifier(),
           false,
+          null,
       );
       const rowData = getRowDataForDetailsElement(details)[0];
       assert.deepEqual(
           rowData,
-            {
-              title: 'Description',
-              value: 'This marks the start of a task',
-            },
+          {
+            title: 'Description',
+            value: 'This marks the start of a task',
+          },
       );
     });
 
@@ -893,6 +845,7 @@ describeWithMockConnection('TimelineUIUtils', function() {
           profileCalls[0],
           new Components.Linkifier.Linkifier(),
           false,
+          null,
       );
       const stackTraceData = getStackTraceForDetailsElement(details);
       assert.exists(stackTraceData);
@@ -920,6 +873,7 @@ describeWithMockConnection('TimelineUIUtils', function() {
           scheduleStyleRecalcs[1],
           new Components.Linkifier.Linkifier(),
           false,
+          null,
       );
       const stackTraceData = getStackTraceForDetailsElement(details);
       assert.deepEqual(
@@ -957,6 +911,7 @@ describeWithMockConnection('TimelineUIUtils', function() {
           stylesRecalc[3],
           new Components.Linkifier.Linkifier(),
           false,
+          null,
       );
       const stackTraceData = getStackTraceForDetailsElement(details);
       assert.deepEqual(
@@ -985,6 +940,7 @@ describeWithMockConnection('TimelineUIUtils', function() {
           extensionMarker,
           new Components.Linkifier.Linkifier(),
           false,
+          null,
       );
       const markerStackTraceData = getStackTraceForDetailsElement(markerDetails);
       assert.exists(markerStackTraceData);
@@ -1003,6 +959,7 @@ describeWithMockConnection('TimelineUIUtils', function() {
           extensionTrackEntry,
           new Components.Linkifier.Linkifier(),
           false,
+          null,
       );
       const trackEntryStackTraceData = getStackTraceForDetailsElement(trackEntryDetails);
       assert.exists(trackEntryStackTraceData);
@@ -1036,6 +993,7 @@ describeWithMockConnection('TimelineUIUtils', function() {
           performanceMark,
           new Components.Linkifier.Linkifier(),
           false,
+          null,
       );
       const markStackTraceData = getStackTraceForDetailsElement(markDetails);
       assert.deepEqual(
@@ -1048,6 +1006,7 @@ describeWithMockConnection('TimelineUIUtils', function() {
           performanceMeasure,
           new Components.Linkifier.Linkifier(),
           false,
+          null,
       );
       const measureStackTraceData = getStackTraceForDetailsElement(measureDetails);
       assert.deepEqual(
@@ -1069,6 +1028,7 @@ describeWithMockConnection('TimelineUIUtils', function() {
           longTask,
           new Components.Linkifier.Linkifier(),
           false,
+          null,
       );
       const rowData = getRowDataForDetailsElement(details);
       assert.deepEqual(
@@ -1078,6 +1038,7 @@ describeWithMockConnection('TimelineUIUtils', function() {
               title: 'Warning',
               value: 'Long task took 1.30\u00A0s.',
             },
+            {title: 'Duration', value: '1.30\xA0s (self 47\xA0μs)'},
           ],
       );
     });
@@ -1098,6 +1059,7 @@ describeWithMockConnection('TimelineUIUtils', function() {
              sendHandshake,
              new Components.Linkifier.Linkifier(),
              false,
+             null,
          );
          const rowData = getRowDataForDetailsElement(details);
          const expectedRowData = [
@@ -1128,6 +1090,7 @@ describeWithMockConnection('TimelineUIUtils', function() {
              sendHandshake,
              new Components.Linkifier.Linkifier(),
              false,
+             null,
          );
          const rowData = getRowDataForDetailsElement(details);
          const expectedRowData = [
@@ -1154,6 +1117,7 @@ describeWithMockConnection('TimelineUIUtils', function() {
           event,
           new Components.Linkifier.Linkifier(),
           true,
+          null,
       );
       const pieChartData = getPieChartDataForDetailsElement(details);
 
@@ -1179,9 +1143,11 @@ describeWithMockConnection('TimelineUIUtils', function() {
           serverTiming,
           new Components.Linkifier.Linkifier(),
           false,
+          null,
       );
       const rowData = getRowDataForDetailsElement(details);
       assert.deepEqual(rowData, [
+        {title: 'Duration', value: '1.00\xA0s'},
         {
           title: 'Description',
           value: 'Description of top level task 1',
@@ -1199,6 +1165,7 @@ describeWithMockConnection('TimelineUIUtils', function() {
           scheduleEvent,
           new Components.Linkifier.Linkifier(),
           false,
+          null,
       );
       const rowData = getRowDataForDetailsElement(scheduleDetails);
       assert.deepEqual(rowData, [
@@ -1222,9 +1189,11 @@ describeWithMockConnection('TimelineUIUtils', function() {
           runEvent,
           new Components.Linkifier.Linkifier(),
           false,
+          null,
       );
       const rowData = getRowDataForDetailsElement(runDetails);
       assert.deepEqual(rowData, [
+        {title: 'Duration', value: '161.18\xA0ms (self 63\xA0μs)'},
         {title: 'Delay', value: '200\xA0ms'},
         {title: 'Priority', value: 'user-visible'},
         {
@@ -1246,6 +1215,7 @@ describeWithMockConnection('TimelineUIUtils', function() {
           jsCall,
           new Components.Linkifier.Linkifier(),
           false,
+          null,
       );
       const container = document.createElement('div');
       renderElementIntoDOM(container);
@@ -1276,7 +1246,29 @@ describeWithMockConnection('TimelineUIUtils', function() {
     });
   });
 
-  it('can generate details for a frame', async function() {
+  it('renders 3p details for profile call properly', async function() {
+    const {parsedTrace} = await TraceLoader.traceEngine(this, 'web-dev.json.gz');
+    const entityMapper = new Timeline.Utils.EntityMapper.EntityMapper(parsedTrace);
+    const jsCall = parsedTrace.Renderer.allTraceEntries.find(
+        e => Trace.Types.Events.isProfileCall(e) && e.callFrame.functionName === 'z');
+    assert.exists(jsCall);
+
+    const details = await Timeline.TimelineUIUtils.TimelineUIUtils.buildTraceEventDetails(
+        parsedTrace,
+        jsCall,
+        new Components.Linkifier.Linkifier(),
+        true,
+        entityMapper,
+    );
+
+    const rowData = getRowDataForDetailsElement(details).find(row => row.title?.startsWith('Third'));
+    assert.deepEqual(rowData, {
+      title: 'Third party',
+      value: 'Google Analytics',
+    });
+  });
+
+  it('can generate details for a frame with the old screenshots format', async function() {
     const {parsedTrace} = await TraceLoader.traceEngine(this, 'web-dev-with-commit.json.gz');
     const frame = parsedTrace.Frames.frames.at(0);
     if (!frame) {
@@ -1291,7 +1283,11 @@ describeWithMockConnection('TimelineUIUtils', function() {
     // Give the image element time to render and load.
     await doubleRaf();
     const img = container.querySelector<HTMLImageElement>('.timeline-filmstrip-preview img');
-    assert.isTrue(img?.currentSrc.includes(filmStrip.frames[0].screenshotEvent.args.dataUri));
+    assert.isOk(img);
+    const filmStripFrame = filmStrip.frames[0];
+    assert.isTrue(
+        Trace.Types.Events.isLegacySyntheticScreenshot(filmStripFrame.screenshotEvent) &&
+        img.currentSrc.includes(filmStripFrame.screenshotEvent.args.dataUri));
 
     const durationRow = container.querySelector<HTMLElement>('[data-row-title="Duration"]');
     const durationValue = durationRow?.querySelector<HTMLSpanElement>('.timeline-details-view-row-value span');
@@ -1304,6 +1300,39 @@ describeWithMockConnection('TimelineUIUtils', function() {
     assert.strictEqual(value, '37.85 ms (at 109.82 ms)');
   });
 
+  it('can generate details for a frame with the new screenshots format', async function() {
+    const {parsedTrace} = await TraceLoader.traceEngine(this, 'web-dev-screenshot-source-ids.json.gz');
+    const frame = parsedTrace.Frames.frames.at(0);
+    if (!frame) {
+      throw new Error('Could not find expected frame');
+    }
+    const filmStrip = Trace.Extras.FilmStrip.fromParsedTrace(parsedTrace);
+    const details =
+        Timeline.TimelineUIUtils.TimelineUIUtils.generateDetailsContentForFrame(frame, filmStrip, filmStrip.frames[0]);
+    const container = document.createElement('div');
+    renderElementIntoDOM(container);
+    container.appendChild(details);
+    // Give the image element time to render and load.
+    await doubleRaf();
+    const img = container.querySelector<HTMLImageElement>('.timeline-filmstrip-preview img');
+    assert.isOk(img);
+    const filmStripFrame = filmStrip.frames[0];
+    assert.isTrue(
+        Trace.Types.Events.isScreenshot(filmStripFrame.screenshotEvent) &&
+        img.currentSrc.includes(
+            Trace.Handlers.ModelHandlers.Screenshots.screenshotImageDataUri(filmStripFrame.screenshotEvent)));
+
+    const durationRow = container.querySelector<HTMLElement>('[data-row-title="Duration"]');
+    const durationValue = durationRow?.querySelector<HTMLSpanElement>('.timeline-details-view-row-value span');
+    if (!durationValue) {
+      throw new Error('Could not find duration');
+    }
+    // Strip the unicode spaces out and replace with simple spaces for easy
+    // assertions.
+    const value = (durationValue.innerText.replaceAll(/\s/g, ' '));
+    assert.strictEqual(value, '208.33 ms (at 1.53 s)');
+  });
+
   describe('eventTitle', function() {
     it('renders the correct title for an EventTiming interaction event', async function() {
       const {parsedTrace} = await TraceLoader.traceEngine(this, 'slow-interaction-button-click.json.gz');
@@ -1352,8 +1381,8 @@ describeWithMockConnection('TimelineUIUtils', function() {
     it('correctly aggregates up stats', async () => {
       const mainThread = Trace.Types.Events.ThreadID(1);
       const pid = Trace.Types.Events.ProcessID(100);
-      function microsec(x: number): Trace.Types.Timing.MicroSeconds {
-        return Trace.Types.Timing.MicroSeconds(x);
+      function microsec(x: number): Trace.Types.Timing.Micro {
+        return Trace.Types.Timing.Micro(x);
       }
 
       const events: Trace.Types.Events.Event[] = [
@@ -1472,8 +1501,8 @@ describeWithMockConnection('TimelineUIUtils', function() {
 
       const rangeStats101To103 = Timeline.TimelineUIUtils.TimelineUIUtils.statsForTimeRange(
           events,
-          Trace.Types.Timing.MilliSeconds(101),
-          Trace.Types.Timing.MilliSeconds(103),
+          Trace.Types.Timing.Milli(101),
+          Trace.Types.Timing.Milli(103),
       );
       assert.deepEqual(rangeStats101To103, {
         other: 1,
@@ -1483,8 +1512,8 @@ describeWithMockConnection('TimelineUIUtils', function() {
       });
       const rangeStats104To109 = Timeline.TimelineUIUtils.TimelineUIUtils.statsForTimeRange(
           events,
-          Trace.Types.Timing.MilliSeconds(104),
-          Trace.Types.Timing.MilliSeconds(109),
+          Trace.Types.Timing.Milli(104),
+          Trace.Types.Timing.Milli(109),
       );
       assert.deepEqual(rangeStats104To109, {
         other: 2,
@@ -1498,7 +1527,7 @@ describeWithMockConnection('TimelineUIUtils', function() {
   describe('isMarkerEvent', () => {
     it('is true for a timestamp event', async function() {
       const {parsedTrace} = await TraceLoader.traceEngine(this, 'web-dev-initial-url.json.gz');
-      const timestamp = parsedTrace.Renderer.allTraceEntries.find(Trace.Types.Events.isTimeStamp);
+      const timestamp = parsedTrace.Renderer.allTraceEntries.find(Trace.Types.Events.isConsoleTimeStamp);
       assert.isOk(timestamp);
       assert.isTrue(Timeline.TimelineUIUtils.isMarkerEvent(parsedTrace, timestamp));
     });