tests: update create-test-trace utility (#13942)

lighthouse-core/test/audits/redirects-test.js

@@ -107,10 +107,11 @@ const FAILING_CLIENTSIDE = [
 describe('Performance: Redirects audit', () => {
   const mockArtifacts = (networkRecords, finalUrl) => {
     const devtoolsLog = networkRecordsToDevtoolsLog(networkRecords);
+    const frameUrl = networkRecords[0].url;
 
     return {
       GatherContext: {gatherMode: 'navigation'},
-      traces: {defaultPass: createTestTrace({traceEnd: 5000})},
+      traces: {defaultPass: createTestTrace({frameUrl, traceEnd: 5000})},
       devtoolsLogs: {defaultPass: devtoolsLog},
       URL: {
         initialUrl: 'about:blank',

lighthouse-core/test/computed/metrics/cumulative-layout-shift-test.js

@@ -298,7 +298,7 @@ describe('Metrics: CLS', () => {
 
       it('ignores layout shift data from other tabs', async () => {
         const trace = createTestTrace({timeOrigin: 0, traceEnd: 2000});
-        const mainFrame = trace.traceEvents[0].args.frame;
+        const mainFrame = trace.traceEvents.find(e => e.name === 'navigationStart').args.frame;
         const childFrame = 'CHILDFRAME';
         const otherMainFrame = 'ANOTHERTABOPEN';
         const cat = 'loading,rail,devtools.timeline';

lighthouse-core/test/create-test-trace.js

@@ -7,14 +7,16 @@
 
 const pid = 1111;
 const tid = 222;
+const browserPid = 13725;
 const rootFrame = '3EFC2700D7BC3F4734CAF2F726EFB78C';
-const frameUrl = 'https://example.com/';
+const defaultUrl = 'https://example.com/';
 
 /** @typedef {{ts: number, duration: number, children?: Array<ChildTaskDef>}} TopLevelTaskDef */
 /** @typedef {{ts: number, duration: number, url: string | undefined}} ChildTaskDef */
 /** @typedef {{frame: string}} ChildFrame */
 /**
  * @typedef TraceOptions
+ * @property {string} [frameUrl]
  * @property {number} [timeOrigin]
  * @property {number} [largestContentfulPaint]
  * @property {number} [traceEnd]
@@ -33,11 +35,8 @@ function getTopLevelTask({ts, duration}) {
     pid,
     tid,
     ph: 'X',
-    cat: 'disabled-by-default-lighthouse',
-    args: {
-      src_file: '../../third_party/blink/renderer/core/fake_runner.cc',
-      src_func: 'FakeRunnerFinished',
-    },
+    cat: 'disabled-by-default-devtools.timeline',
+    args: {},
   };
 }
 
@@ -52,12 +51,11 @@ function getChildTask({ts, duration, url}) {
     pid,
     tid,
     ph: 'X',
-    cat: 'disabled-by-default-lighthouse',
+    cat: 'devtools.timeline',
     args: {
-      src_file: '../../third_party/blink/renderer/core/fake_runner.cc',
-      src_func: 'FakeRunnerFinished',
       data: {
         url,
+        functionName: 'fakeFunction',
       },
     },
   };
@@ -70,34 +68,38 @@ function getChildTask({ts, duration, url}) {
  * @param {TraceOptions} options
  */
 function createTestTrace(options) {
+  const frameUrl = options.frameUrl ?? defaultUrl;
   const timeOrigin = (options.timeOrigin || 0) * 1000;
 
   const traceEvents = [{
-    name: 'navigationStart',
-    ts: timeOrigin,
-    pid,
-    tid,
-    ph: 'R',
-    cat: 'blink.user_timing',
-    args: {
-      frame: rootFrame,
-      data: {documentLoaderURL: 'https://example.com/'},
-    },
-  }, {
     name: 'TracingStartedInBrowser',
     ts: timeOrigin,
-    pid,
+    pid: browserPid,
     tid,
     ph: 'I',
     cat: 'disabled-by-default-devtools.timeline',
     args: {
       data: {
         frameTreeNodeId: 6,
         persistentIds: true,
-        frames: [{frame: rootFrame, url: frameUrl, name: '', processId: pid}],
+        frames: [{frame: rootFrame, url: 'about:blank', name: '', processId: pid}],
       },
     },
     s: 't',
+  }, {
+    name: 'navigationStart',
+    ts: timeOrigin,
+    pid,
+    tid,
+    ph: 'R',
+    cat: 'blink.user_timing',
+    args: {
+      frame: rootFrame,
+      data: {
+        documentLoaderURL: frameUrl,
+        isLoadingMainFrame: true,
+      },
+    },
   }, {
     // Needed to identify main thread for TracingStartedInBrowser.
     name: 'thread_name',
@@ -111,7 +113,7 @@ function createTestTrace(options) {
     // Used for identifying frame tree.
     name: 'FrameCommittedInBrowser',
     ts: timeOrigin,
-    pid,
+    pid: browserPid,
     tid,
     ph: 'I',
     cat: 'disabled-by-default-devtools.timeline',
@@ -149,7 +151,7 @@ function createTestTrace(options) {
       traceEvents.push({
         name: 'FrameCommittedInBrowser',
         ts: timeOrigin + 20,
-        pid,
+        pid: browserPid,
         tid,
         ph: 'I',
         cat: 'disabled-by-default-devtools.timeline',
@@ -174,7 +176,7 @@ function createTestTrace(options) {
       tid,
       ph: 'R',
       cat: 'loading,rail,devtools.timeline',
-      args: {frame: rootFrame, data: {size: 50}},
+      args: {frame: rootFrame, isMainFrame: true, data: {size: 50}},
     });
   }
 

lighthouse-core/test/lib/tracehouse/trace-processor-test.js

@@ -204,7 +204,7 @@ describe('TraceProcessor', () => {
   describe('.processTrace() - frameTreeEvents', () => {
     it('frameTreeEvents excludes other frame trees', () => {
       const testTrace = createTestTrace({timeOrigin: 0, traceEnd: 2000});
-      const mainFrame = testTrace.traceEvents[0].args.frame;
+      const mainFrame = testTrace.traceEvents.find(e => e.name === 'navigationStart').args.frame;
       const childFrame = 'CHILDFRAME';
       const otherMainFrame = 'ANOTHERTAB';
       const cat = 'loading,rail,devtools.timeline';
@@ -230,7 +230,7 @@ describe('TraceProcessor', () => {
 
     it('frameTreeEvents includes main frame events if no FrameCommittedInBrowser found', () => {
       const testTrace = createTestTrace({timeOrigin: 0, traceEnd: 2000});
-      const mainFrame = testTrace.traceEvents[0].args.frame;
+      const mainFrame = testTrace.traceEvents.find(e => e.name === 'navigationStart').args.frame;
       const childFrame = 'CHILDFRAME';
       const otherMainFrame = 'ANOTHERTAB';
       const cat = 'loading,rail,devtools.timeline';
@@ -256,7 +256,7 @@ describe('TraceProcessor', () => {
       testTrace.traceEvents = testTrace.traceEvents
         .filter(e => e.name !== 'FrameCommittedInBrowser');
 
-      const mainFrame = testTrace.traceEvents[0].args.frame;
+      const mainFrame = testTrace.traceEvents.find(e => e.name === 'navigationStart').args.frame;
       const childFrame = 'CHILDFRAME';
       const otherMainFrame = 'ANOTHERTAB';
       const cat = 'loading,rail,devtools.timeline';
@@ -566,7 +566,7 @@ Object {
 
       it('uses latest candidate', () => {
         const testTrace = createTestTrace({timeOrigin: 0, traceEnd: 2000});
-        const frame = testTrace.traceEvents[0].args.frame;
+        const frame = testTrace.traceEvents.find(e => e.name === 'navigationStart').args.frame;
         const args = {frame, data: {size: 50}};
         const cat = 'loading,rail,devtools.timeline';
         testTrace.traceEvents.push(
@@ -590,7 +590,7 @@ Object {
 
       it('invalidates if last event is ::Invalidate', () => {
         const testTrace = createTestTrace({timeOrigin: 0, traceEnd: 2000});
-        const frame = testTrace.traceEvents[0].args.frame;
+        const frame = testTrace.traceEvents.find(e => e.name === 'navigationStart').args.frame;
         const args = {frame};
         const cat = 'loading,rail,devtools.timeline';
         testTrace.traceEvents.push(
@@ -659,7 +659,7 @@ Object {
 
       it('finds FCP from all frames', () => {
         const testTrace = createTestTrace({timeOrigin: 0, traceEnd: 2000});
-        const mainFrame = testTrace.traceEvents[0].args.frame;
+        const mainFrame = testTrace.traceEvents.find(e => e.name === 'navigationStart').args.frame;
         const childFrame = 'CHILDFRAME';
         const cat = 'loading,rail,devtools.timeline';
 
@@ -682,7 +682,7 @@ Object {
 
       it('finds LCP from all frames', () => {
         const testTrace = createTestTrace({timeOrigin: 0, traceEnd: 2000});
-        const mainFrame = testTrace.traceEvents[0].args.frame;
+        const mainFrame = testTrace.traceEvents.find(e => e.name === 'navigationStart').args.frame;
         const childFrame = 'CHILDFRAME';
         const cat = 'loading,rail,devtools.timeline';
         testTrace.traceEvents.push(