AI: make AI formatters take unit formatters as input

So they can be reused in the future outside of this repo, we want to
reduce the amount of DevTools they pull in.

DISABLE_SPELLCHECKER=finding issues in test data that we do not control

Bug: 441265851
Change-Id: I394ab89c05c0c039a98e4ee012c4a3e276100dba
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/6905368
Reviewed-by: Alex Rudenko <[email protected]>
Commit-Queue: Alex Rudenko <[email protected]>
Auto-Submit: Jack Franklin <[email protected]>

Author: jackfranklin

config/gni/devtools_grd_files.gni

@@ -1022,6 +1022,7 @@ grd_files_unbundled_sources = [
   "front_end/models/ai_assistance/data_formatters/NetworkRequestFormatter.js",
   "front_end/models/ai_assistance/data_formatters/PerformanceInsightFormatter.js",
   "front_end/models/ai_assistance/data_formatters/PerformanceTraceFormatter.js",
+  "front_end/models/ai_assistance/data_formatters/Types.js",
   "front_end/models/ai_assistance/debug.js",
   "front_end/models/ai_assistance/injected.js",
   "front_end/models/ai_code_completion/AiCodeCompletion.js",

front_end/models/ai_assistance/BUILD.gn

@@ -27,6 +27,7 @@ devtools_module("ai_assistance") {
     "data_formatters/NetworkRequestFormatter.ts",
     "data_formatters/PerformanceInsightFormatter.ts",
     "data_formatters/PerformanceTraceFormatter.ts",
+    "data_formatters/Types.ts",
     "debug.ts",
     "injected.ts",
   ]

front_end/models/ai_assistance/agents/PerformanceAgent.test.ts

@@ -20,6 +20,7 @@ import * as Trace from '../../trace/trace.js';
 import {
   type ActionResponse,
   ConversationType,
+  PERF_AGENT_UNIT_FORMATTERS,
   PerformanceAgent,
   PerformanceInsightFormatter,
   PerformanceTraceContext,
@@ -350,7 +351,9 @@ code
         }]])
       });
 
-      const expectedDetailText = new PerformanceInsightFormatter(FAKE_PARSED_TRACE, FAKE_LCP_MODEL).formatInsight();
+      const expectedDetailText =
+          new PerformanceInsightFormatter(PERF_AGENT_UNIT_FORMATTERS, FAKE_PARSED_TRACE, FAKE_LCP_MODEL)
+              .formatInsight();
 
       const responses = await Array.fromAsync(agent.run('test', {selected: context}));
       assert.deepEqual(responses, [
@@ -388,7 +391,9 @@ code
       });
 
       const context = PerformanceTraceContext.fromInsight(FAKE_PARSED_TRACE, FAKE_LCP_MODEL, FAKE_INSIGHT_SET_BOUNDS);
-      const extraContext = new PerformanceInsightFormatter(FAKE_PARSED_TRACE, FAKE_LCP_MODEL).formatInsight();
+      const extraContext =
+          new PerformanceInsightFormatter(PERF_AGENT_UNIT_FORMATTERS, FAKE_PARSED_TRACE, FAKE_LCP_MODEL)
+              .formatInsight();
 
       const finalQuery = await agent.enhanceQuery('What is this?', context);
       const expected = `${extraContext}
@@ -461,7 +466,8 @@ Help me understand?`;
         return match;
       });
 
-      const expectedRequestsOutput = TraceEventFormatter.networkRequests(requests, parsedTrace);
+      const expectedRequestsOutput =
+          TraceEventFormatter.networkRequests(PERF_AGENT_UNIT_FORMATTERS, requests, parsedTrace);
 
       const expectedBytesSize = Platform.StringUtilities.countWtf8Bytes(expectedRequestsOutput);
       sinon.assert.calledWith(metricsSpy, expectedBytesSize);
@@ -505,7 +511,8 @@ Help me understand?`;
       const request = parsedTrace.NetworkRequests.byTime.find(r => r.args.data.url === requestUrl);
       assert.isOk(request);
 
-      const expectedRequestOutput = TraceEventFormatter.networkRequests([request], parsedTrace, {verbose: true});
+      const expectedRequestOutput =
+          TraceEventFormatter.networkRequests(PERF_AGENT_UNIT_FORMATTERS, [request], parsedTrace, {verbose: true});
       const expectedOutput = JSON.stringify({request: expectedRequestOutput});
 
       const expectedBytesSize = Platform.StringUtilities.countWtf8Bytes(expectedRequestOutput);

front_end/models/ai_assistance/agents/PerformanceAgent.ts

@@ -14,8 +14,12 @@ import * as TimelineUtils from '../../../panels/timeline/utils/utils.js';
 import {html, type TemplateResult} from '../../../ui/lit/lit.js';
 import * as Trace from '../../trace/trace.js';
 import {ConversationType} from '../AiHistoryStorage.js';
-import {PerformanceInsightFormatter, TraceEventFormatter} from '../data_formatters/PerformanceInsightFormatter.js';
+import {
+  PerformanceInsightFormatter,
+  TraceEventFormatter,
+} from '../data_formatters/PerformanceInsightFormatter.js';
 import {PerformanceTraceFormatter} from '../data_formatters/PerformanceTraceFormatter.js';
+import type {UnitFormatters} from '../data_formatters/Types.js';
 import {debugLog} from '../debug.js';
 
 import {
@@ -284,6 +288,19 @@ enum ScorePriority {
   DEFAULT = 1,
 }
 
+export const PERF_AGENT_UNIT_FORMATTERS: UnitFormatters = {
+  micros(x) {
+    const milli = Trace.Helpers.Timing.microToMilli(x as Trace.Types.Timing.Micro);
+    return PERF_AGENT_UNIT_FORMATTERS.millis(milli);
+  },
+  millis(x) {
+    return i18n.TimeUtilities.preciseMillisToString(x, 1, ' ');
+  },
+  bytes(x) {
+    return i18n.ByteUtilities.bytesToString(x);
+  },
+};
+
 export class PerformanceTraceContext extends ConversationContext<TimelineUtils.AIContext.AgentFocus> {
   static full(
       parsedTrace: Trace.Handlers.Types.ParsedTrace, insights: Trace.Insights.Types.TraceInsightSets,
@@ -393,7 +410,8 @@ export class PerformanceTraceContext extends ConversationContext<TimelineUtils.A
       return;
     }
 
-    return new PerformanceInsightFormatter(focus.parsedTrace, focus.insight).getSuggestions();
+    return new PerformanceInsightFormatter(PERF_AGENT_UNIT_FORMATTERS, focus.parsedTrace, focus.insight)
+        .getSuggestions();
   }
 }
 
@@ -538,7 +556,8 @@ export class PerformanceAgent extends AiAgent<TimelineUtils.AIContext.AgentFocus
     }
 
     if (focus.data.type === 'insight') {
-      const formatter = new PerformanceInsightFormatter(focus.data.parsedTrace, focus.data.insight);
+      const formatter =
+          new PerformanceInsightFormatter(PERF_AGENT_UNIT_FORMATTERS, focus.data.parsedTrace, focus.data.insight);
       return formatter.formatInsight();
     }
 
@@ -782,7 +801,7 @@ export class PerformanceAgent extends AiAgent<TimelineUtils.AIContext.AgentFocus
     this.addFact(this.#networkDataDescriptionFact);
 
     if (!this.#traceFacts.length) {
-      this.#formatter = new PerformanceTraceFormatter(focus, this.#eventsSerializer);
+      this.#formatter = new PerformanceTraceFormatter(PERF_AGENT_UNIT_FORMATTERS, focus, this.#eventsSerializer);
       this.#createFactForTraceSummary(focus);
       this.#createFactForCriticalRequests();
       this.#createFactForMainThreadBottomUpSummary();
@@ -847,7 +866,8 @@ export class PerformanceAgent extends AiAgent<TimelineUtils.AIContext.AgentFocus
           return {error: 'No insight available'};
         }
 
-        const details = new PerformanceInsightFormatter(parsedTrace, insight).formatInsight();
+        const details =
+            new PerformanceInsightFormatter(PERF_AGENT_UNIT_FORMATTERS, parsedTrace, insight).formatInsight();
 
         const key = `getInsightDetails('${params.insightName}')`;
         this.#cacheFunctionResult(focus, key, details);
@@ -1122,7 +1142,7 @@ export class PerformanceAgent extends AiAgent<TimelineUtils.AIContext.AgentFocus
             insightSetBounds,
             parsedTrace,
         );
-        const formatted = TraceEventFormatter.networkRequests(requests, parsedTrace);
+        const formatted = TraceEventFormatter.networkRequests(PERF_AGENT_UNIT_FORMATTERS, requests, parsedTrace);
 
         const byteCount = Platform.StringUtilities.countWtf8Bytes(formatted);
         Host.userMetrics.performanceAINetworkSummaryResponseSize(byteCount);
@@ -1179,7 +1199,8 @@ export class PerformanceAgent extends AiAgent<TimelineUtils.AIContext.AgentFocus
         if (!request) {
           return {error: 'Request not found'};
         }
-        const formatted = TraceEventFormatter.networkRequests([request], parsedTrace, {verbose: true});
+        const formatted =
+            TraceEventFormatter.networkRequests(PERF_AGENT_UNIT_FORMATTERS, [request], parsedTrace, {verbose: true});
 
         const byteCount = Platform.StringUtilities.countWtf8Bytes(formatted);
         Host.userMetrics.performanceAINetworkRequestDetailResponseSize(byteCount);

front_end/models/ai_assistance/ai_assistance.ts

@@ -20,4 +20,5 @@ export * from './data_formatters/FileFormatter.js';
 export * from './data_formatters/NetworkRequestFormatter.js';
 export * from './data_formatters/PerformanceInsightFormatter.js';
 export * from './data_formatters/PerformanceTraceFormatter.js';
+export * from './data_formatters/Types.js';
 export * from './ConversationHandler.js';