core: Support traces with TracingStartedInBrowser event

Since version 67 Chrome uses a new schema to describe page frame tree. The tree is encoded within TracingStartedInBrowser trace event. The patch makes lighthouse to support the new event. Legacy TracingStartedInPage event is going to the removed soon.
GoogleChrome · May 24, 2018 · 9f252e3 · 9f252e3
1 parent 1b5bf18
commit 9f252e3
Show file tree

Hide file tree

Showing 4 changed files with 71 additions and 8 deletions.
diff --git a/lighthouse-core/gather/computed/trace-of-tab.js b/lighthouse-core/gather/computed/trace-of-tab.js
@@ -45,18 +45,34 @@ class TraceOfTab extends ComputedArtifact {
       .filter(e => {
         return e.cat.includes('blink.user_timing') ||
           e.cat.includes('loading') ||
-          e.cat.includes('devtools.timeline') ||
-          e.name === 'TracingStartedInPage';
+          e.cat.includes('devtools.timeline');
       })
       // @ts-ignore - stableSort added to Array by WebInspector.
       .stableSort((event0, event1) => event0.ts - event1.ts);
 
-    // The first TracingStartedInPage in the trace is definitely our renderer thread of interest
-    // Beware: the tracingStartedInPage event can appear slightly after a navigationStart
-    const startedInPageEvt = keyEvents.find(e => e.name === 'TracingStartedInPage');
+    // Find out the inspected page frame.
+    /** @type {LH.TraceEvent|undefined} */
+    let startedInPageEvt;
+    const startedInBrowserEvt = keyEvents.find(e => e.name === 'TracingStartedInBrowser');
+    if (startedInBrowserEvt && startedInBrowserEvt.args.data &&
+        startedInBrowserEvt.args.data.persistentIds) {
+      const mainFrame = (startedInBrowserEvt.args.data.frames || []).find(frame => !frame.parent);
+      const mainFrameId = mainFrame && mainFrame.frame;
+      startedInPageEvt = mainFrameId ?
+        Object.assign({}, startedInBrowserEvt, {
+          name: 'TracingStartedInPage', args: {data: {page: mainFrameId}}}) :
+        undefined;
+    }
+    // Support legacy browser versions that do not emit TracingStartedInBrowser event.
+    if (!startedInPageEvt) {
+      // The first TracingStartedInPage in the trace is definitely our renderer thread of interest
+      // Beware: the tracingStartedInPage event can appear slightly after a navigationStart
+      startedInPageEvt = keyEvents.find(e => e.name === 'TracingStartedInPage');
+    }
     if (!startedInPageEvt) throw new LHError(LHError.errors.NO_TRACING_STARTED);
     // @ts-ignore - property chain exists for 'TracingStartedInPage' event.
     const frameId = startedInPageEvt.args.data.page;
+
     // Filter to just events matching the frame ID for sanity
     const frameEvents = keyEvents.filter(e => e.args.frame === frameId);
 
@@ -106,12 +122,13 @@ class TraceOfTab extends ComputedArtifact {
     // stable-sort events to keep them correctly nested.
     /** @type Array<LH.TraceEvent> */
     const processEvents = trace.traceEvents
+      // @ts-ignore - property chain exists for 'TracingStartedInPage' event.
       .filter(e => e.pid === startedInPageEvt.pid)
       // @ts-ignore - stableSort added to Array by WebInspector.
       .stableSort((event0, event1) => event0.ts - event1.ts);
 
-    const mainThreadEvents = processEvents
-      .filter(e => e.tid === startedInPageEvt.tid);
+    // @ts-ignore - property chain exists for 'TracingStartedInPage' event.
+    const mainThreadEvents = processEvents.filter(e => e.tid === startedInPageEvt.tid);
 
     const traceEnd = trace.traceEvents.reduce((max, evt) => {
       return max.ts > evt.ts ? max : evt;

diff --git a/lighthouse-core/test/fixtures/traces/threeframes-blank_content_more.json b/lighthouse-core/test/fixtures/traces/threeframes-blank_content_more.json
@@ -20,7 +20,7 @@
 				"tid": 1295,
 				"ts": 900000000000,
 				"ph": "X",
-				"cat": "toplevel",
+				"cat": "devtools.timeline",
 				"name": "TracingStartedInPage",
 				"args": {
 					"data": {

diff --git a/lighthouse-core/test/gather/computed/trace-of-tab-test.js b/lighthouse-core/test/gather/computed/trace-of-tab-test.js
@@ -112,6 +112,47 @@ describe('Trace of Tab computed artifact:', () => {
     assert.equal(trace.firstMeaningfulPaintEvt, undefined, 'bad fmp');
   });
 
+  it('handles traces with TracingStartedInBrowser events', async () => {
+    const tracingStartedInBrowserTrace = {
+      'traceEvents': [{
+        'pid': 69850,
+        'tid': 69850,
+        'ts': 2193564729582,
+        'ph': 'I',
+        'cat': 'disabled-by-default-devtools.timeline',
+        'name': 'TracingStartedInBrowser',
+        'args': {'data': {
+          'frameTreeNodeId': 1,
+          'persistentIds': true,
+          'frames': [{
+            'frame': 'B192D1F3355A6F961EC8F0B01623C1FB',
+            'url': 'http://www.example.com/',
+            'name': '',
+            'processId': 69920,
+          }],
+        }},
+        'tts': 1085165,
+        's': 't',
+      }, {
+        'pid': 69920,
+        'tid': 1,
+        'ts': 2193564790059,
+        'ph': 'R',
+        'cat': 'blink.user_timing',
+        'name': 'navigationStart',
+        'args': {
+          'frame': 'B192D1F3355A6F961EC8F0B01623C1FB',
+          'data': {
+            'documentLoaderURL': 'http://www.example.com/',
+            'isLoadingMainFrame': true,
+          },
+        },
+        'tts': 141371,
+      }]};
+    const trace = await traceOfTab.compute_(tracingStartedInBrowserTrace);
+    assert.equal(trace.startedInPageEvt.ts, 2193564729582);
+  });
+
   it('stably sorts events', async () => {
     const traceJson = fs.readFileSync(__dirname +
         '/../../fixtures/traces/tracingstarted-after-navstart.json', 'utf8');

diff --git a/typings/externs.d.ts b/typings/externs.d.ts
@@ -137,6 +137,11 @@ declare global {
       cat: string;
       args: {
         data?: {
+          persistentIds?: boolean;
+          frames?: {
+            frame: string;
+            parent?: string;
+          }[];
           page?: string;
           readyState?: number;
           requestId?: string;