fix: roll latest DevTools to handle Insight errors (#149)

This commit updates DevTools to the latest release. This most
importantly includes a fix for #124 and other reported issues where
Insights that were actually errors were not handled correctly. They are
now formatted correctly on the DevTools side and now will not break
performance traces in the MCP server.

Author: jackfranklin

package-lock.json

@@ -51,7 +51,7 @@
     "@types/yargs": "^17.0.33",
     "@typescript-eslint/eslint-plugin": "^8.43.0",
     "@typescript-eslint/parser": "^8.43.0",
-    "chrome-devtools-frontend": "1.0.1516909",
+    "chrome-devtools-frontend": "1.0.1520139",
     "eslint": "^9.35.0",
     "eslint-plugin-import": "^2.32.0",
     "eslint-import-resolver-typescript": "^4.4.4",

package.json

@@ -74,9 +74,11 @@ export async function parseRawTraceBuffer(
 }
 
 export function getTraceSummary(result: TraceResult): string {
-  const focus = AgentFocus.full(result.parsedTrace);
-  const serializer = new TraceEngine.EventsSerializer.EventsSerializer();
-  const formatter = new PerformanceTraceFormatter(focus, serializer);
+  const focus = AgentFocus.fromParsedTrace(result.parsedTrace);
+  const formatter = new PerformanceTraceFormatter(
+    focus,
+    PerformanceInsightFormatter.create,
+  );
   const output = formatter.formatTraceSummary();
   return output;
 }
@@ -122,7 +124,7 @@ export function getInsightOutput(
   }
 
   const formatter = new PerformanceInsightFormatter(
-    result.parsedTrace,
+    AgentFocus.fromParsedTrace(result.parsedTrace),
     matchingInsight,
   );
   return {output: formatter.formatInsight()};

src/trace-processing/parse.ts

@@ -6,8 +6,9 @@ This insight is used to analyze the time spent that contributed to the final LCP
 
 ## Detailed analysis:
 The Largest Contentful Paint (LCP) time for this navigation was 129 ms.
-The LCP element is an image fetched from \`https://web-dev.imgix.net/image/kheDArv5csY6rvQUJDbWRscckLr1/4i7JstVZvgTFk9dxCe4a.svg\`.
+The LCP element is an image fetched from https://web-dev.imgix.net/image/kheDArv5csY6rvQUJDbWRscckLr1/4i7JstVZvgTFk9dxCe4a.svg (eventKey: s-1314).
 ## LCP resource network request: https://web-dev.imgix.net/image/kheDArv5csY6rvQUJDbWRscckLr1/4i7JstVZvgTFk9dxCe4a.svg
+eventKey: s-1314
 Timings:
 - Queued at: 41 ms
 - Request sent at: 47 ms
@@ -55,7 +56,7 @@ Bounds: {min: 122410994891, max: 122416385853}
 CPU throttling: none
 Network throttling: none
 Metrics (lab / observed):
-  - LCP: 129 ms, event: (eventKey: r-6063, ts: 122411126100)
+  - LCP: 129 ms, event: (eventKey: r-6063, ts: 122411126100), nodeId: 7
   - LCP breakdown:
     - TTFB: 8 ms, bounds: {min: 122410996889, max: 122411004828}
     - Load delay: 33 ms, bounds: {min: 122411004828, max: 122411037986}

tests/tools/performance.test.js.snapshot

@@ -4,7 +4,7 @@ Bounds: {min: 122410994891, max: 122416385853}
 CPU throttling: none
 Network throttling: none
 Metrics (lab / observed):
-  - LCP: 129 ms, event: (eventKey: r-6063, ts: 122411126100)
+  - LCP: 129 ms, event: (eventKey: r-6063, ts: 122411126100), nodeId: 7
   - LCP breakdown:
     - TTFB: 8 ms, bounds: {min: 122410996889, max: 122411004828}
     - Load delay: 33 ms, bounds: {min: 122411004828, max: 122411037986}