chrome-devtools-frontend 1.0.1376716 → 1.0.1386602

package/front_end/panels/freestyler/DrJonesNetworkAgent.test.ts

@@ -15,7 +15,14 @@ import {describeWithMockConnection} from '../../testing/MockConnection.js';
 import {createNetworkPanelForMockConnection} from '../../testing/NetworkHelpers.js';
 import * as Coordinator from '../../ui/components/render_coordinator/render_coordinator.js';
 
-import {allowHeader, DrJonesNetworkAgent, formatHeaders, formatInitiatorUrl, ResponseType} from './freestyler.js';
+import {
+  allowHeader,
+  DrJonesNetworkAgent,
+  formatHeaders,
+  formatInitiatorUrl,
+  RequestContext,
+  ResponseType,
+} from './freestyler.js';
 
 const coordinator = Coordinator.RenderCoordinator.RenderCoordinator.instance();
 
@@ -75,19 +82,20 @@ describeWithMockConnection('DrJonesNetworkAgent', () => {
         serverSideLoggingEnabled: true,
       });
       sinon.stub(agent, 'preamble').value('preamble');
-      agent.chatNewHistoryForTesting = new Map([[
-        0,
-        [
-          {
-            type: ResponseType.QUERYING,
-            query: 'questions',
-          },
-          {
-            type: ResponseType.ANSWER,
-            text: 'answer',
-          },
-        ],
-      ]]);
+      agent.chatNewHistoryForTesting = [
+        {
+          type: ResponseType.USER_QUERY,
+          query: 'questions',
+        },
+        {
+          type: ResponseType.QUERYING,
+          query: 'questions',
+        },
+        {
+          type: ResponseType.ANSWER,
+          text: 'answer',
+        },
+      ];
       assert.deepStrictEqual(
           agent.buildRequest({
             input: 'test input',
@@ -215,7 +223,8 @@ describeWithMockConnection('DrJonesNetworkAgent', () => {
         aidaClient: mockAidaClient(generateAnswer),
       });
 
-      const responses = await Array.fromAsync(agent.run('test', {selected: selectedNetworkRequest}));
+      const responses =
+          await Array.fromAsync(agent.run('test', {selected: new RequestContext(selectedNetworkRequest)}));
       assert.deepStrictEqual(responses, [
         {
           type: ResponseType.USER_QUERY,
@@ -236,7 +245,7 @@ describeWithMockConnection('DrJonesNetworkAgent', () => {
             {
               title: 'Timing',
               text:
-                  'Queued at (timestamp): 0 μs\nStarted at (timestamp): 8.3 min\nQueueing (duration): 8.3 min\nConnection start (stalled) (duration): 800.00 ms\nRequest sent (duration): 100.00 ms\nDuration (duration): 8.3 min',
+                  'Queued at (timestamp): 0 μs\nStarted at (timestamp): 8.4 min\nQueueing (duration): 8.4 min\nConnection start (stalled) (duration): 800.00 ms\nRequest sent (duration): 100.00 ms\nDuration (duration): 8.4 min',
             },
             {
               title: 'Request initiator chain',
@@ -250,7 +259,7 @@ describeWithMockConnection('DrJonesNetworkAgent', () => {
         {
           type: ResponseType.QUERYING,
           query:
-              '# Selected network request \nRequest: https://www.example.com\n\nRequest headers:\ncontent-type: bar1\n\nResponse headers:\ncontent-type: bar2\nx-forwarded-for: bar3\n\nResponse status: 200 \n\nRequest timing:\nQueued at (timestamp): 0 μs\nStarted at (timestamp): 8.3 min\nQueueing (duration): 8.3 min\nConnection start (stalled) (duration): 800.00 ms\nRequest sent (duration): 100.00 ms\nDuration (duration): 8.3 min\n\nRequest initiator chain:\n- URL: <redacted cross-origin initiator URL>\n\t- URL: https://www.example.com\n\t\t- URL: https://www.example.com/1\n\t\t- URL: https://www.example.com/2\n\n# User request\n\ntest',
+              '# Selected network request \nRequest: https://www.example.com\n\nRequest headers:\ncontent-type: bar1\n\nResponse headers:\ncontent-type: bar2\nx-forwarded-for: bar3\n\nResponse status: 200 \n\nRequest timing:\nQueued at (timestamp): 0 μs\nStarted at (timestamp): 8.4 min\nQueueing (duration): 8.4 min\nConnection start (stalled) (duration): 800.00 ms\nRequest sent (duration): 100.00 ms\nDuration (duration): 8.4 min\n\nRequest initiator chain:\n- URL: <redacted cross-origin initiator URL>\n\t- URL: https://www.example.com\n\t\t- URL: https://www.example.com/1\n\t\t- URL: https://www.example.com/2\n\n# User request\n\ntest',
         },
         {
           type: ResponseType.ANSWER,
@@ -274,11 +283,11 @@ x-forwarded-for: bar3
 Response status: 200 \n
 Request timing:
 Queued at (timestamp): 0 μs
-Started at (timestamp): 8.3 min
-Queueing (duration): 8.3 min
+Started at (timestamp): 8.4 min
+Queueing (duration): 8.4 min
 Connection start (stalled) (duration): 800.00 ms
 Request sent (duration): 100.00 ms
-Duration (duration): 8.3 min
+Duration (duration): 8.4 min
 
 Request initiator chain:
 - URL: <redacted cross-origin initiator URL>

package/front_end/panels/freestyler/DrJonesNetworkAgent.ts

@@ -8,14 +8,16 @@ import * as i18n from '../../core/i18n/i18n.js';
 import type * as SDK from '../../core/sdk/sdk.js';
 import * as Logs from '../../models/logs/logs.js';
 import * as Network from '../../panels/network/network.js';
+import * as PanelUtils from '../utils/utils.js';
 
 import {
   AgentType,
   AiAgent,
-  type AidaRequestOptions,
   type ContextDetail,
   type ContextResponse,
+  ConversationContext,
   type ParsedResponse,
+  type RequestOptions,
   ResponseType,
 } from './AiAgent.js';
 
@@ -97,24 +99,47 @@ const UIStringsNotTranslate = {
 
 const lockedString = i18n.i18n.lockedString;
 
+export class RequestContext extends ConversationContext<SDK.NetworkRequest.NetworkRequest> {
+  #request: SDK.NetworkRequest.NetworkRequest;
+
+  constructor(request: SDK.NetworkRequest.NetworkRequest) {
+    super();
+    this.#request = request;
+  }
+
+  override getOrigin(): string {
+    return new URL(this.#request.url()).origin;
+  }
+
+  override getItem(): SDK.NetworkRequest.NetworkRequest {
+    return this.#request;
+  }
+
+  override getIcon(): HTMLElement {
+    return PanelUtils.PanelUtils.getIconForNetworkRequest(this.#request);
+  }
+
+  override getTitle(): string {
+    return this.#request.name();
+  }
+}
+
 /**
  * One agent instance handles one conversation. Create a new agent
  * instance for a new conversation.
  */
 export class DrJonesNetworkAgent extends AiAgent<SDK.NetworkRequest.NetworkRequest> {
-  override type = AgentType.DRJONES_NETWORK_REQUEST;
+  override readonly type = AgentType.DRJONES_NETWORK_REQUEST;
   readonly preamble = preamble;
   readonly clientFeature = Host.AidaClient.ClientFeature.CHROME_DRJONES_NETWORK_AGENT;
   get userTier(): string|undefined {
     const config = Common.Settings.Settings.instance().getHostConfig();
-    return config.devToolsAiAssistanceNetworkAgent?.userTier ?? config.devToolsExplainThisResourceDogfood?.userTier;
+    return config.devToolsAiAssistanceNetworkAgent?.userTier;
   }
-  get options(): AidaRequestOptions {
+  get options(): RequestOptions {
     const config = Common.Settings.Settings.instance().getHostConfig();
-    const temperature =
-        config.devToolsAiAssistanceNetworkAgent?.temperature ?? config.devToolsExplainThisResourceDogfood?.temperature;
-    const modelId =
-        config.devToolsAiAssistanceNetworkAgent?.modelId ?? config.devToolsExplainThisResourceDogfood?.modelId;
+    const temperature = config.devToolsAiAssistanceNetworkAgent?.temperature;
+    const modelId = config.devToolsAiAssistanceNetworkAgent?.modelId;
 
     return {
       temperature,
@@ -123,7 +148,7 @@ export class DrJonesNetworkAgent extends AiAgent<SDK.NetworkRequest.NetworkReque
   }
 
   async *
-      handleContextDetails(selectedNetworkRequest: SDK.NetworkRequest.NetworkRequest|null):
+      handleContextDetails(selectedNetworkRequest: ConversationContext<SDK.NetworkRequest.NetworkRequest>|null):
           AsyncGenerator<ContextResponse, void, void> {
     if (!selectedNetworkRequest) {
       return;
@@ -132,14 +157,15 @@ export class DrJonesNetworkAgent extends AiAgent<SDK.NetworkRequest.NetworkReque
     yield {
       type: ResponseType.CONTEXT,
       title: lockedString(UIStringsNotTranslate.analyzingNetworkData),
-      details: createContextDetailsForDrJonesNetworkAgent(selectedNetworkRequest),
+      details: createContextDetailsForDrJonesNetworkAgent(selectedNetworkRequest.getItem()),
     };
   }
 
-  override async enhanceQuery(query: string, selectedNetworkRequest: SDK.NetworkRequest.NetworkRequest|null):
-      Promise<string> {
+  override async enhanceQuery(
+      query: string,
+      selectedNetworkRequest: ConversationContext<SDK.NetworkRequest.NetworkRequest>|null): Promise<string> {
     const networkEnchantmentQuery = selectedNetworkRequest ?
-        `# Selected network request \n${formatNetworkRequest(selectedNetworkRequest)}\n\n# User request\n\n` :
+        `# Selected network request \n${formatNetworkRequest(selectedNetworkRequest.getItem())}\n\n# User request\n\n` :
         '';
     return `${networkEnchantmentQuery}${query}`;
   }
@@ -190,9 +216,7 @@ const allowedHeaders = new Set([
   'content-disposition',
   'content-encoding',
   'content-language',
-  'content-length',
   'content-location',
-  'content-md5',
   'content-range',
   'content-security-policy',
   'content-type',
@@ -200,7 +224,6 @@ const allowedHeaders = new Set([
   'date',
   'delta-base',
   'dnt',
-  'etag',
   'expect-ct',
   'expect',
   'expires',
@@ -208,9 +231,7 @@ const allowedHeaders = new Set([
   'front-end-https',
   'host',
   'http2-settings',
-  'if-match',
   'if-modified-since',
-  'if-none-match',
   'if-range',
   'if-unmodified-source',
   'im',

package/front_end/panels/freestyler/DrJonesPerformanceAgent.test.ts

@@ -7,12 +7,12 @@ import {describeWithEnvironment, getGetHostConfigStub} from '../../testing/Envir
 import {TraceLoader} from '../../testing/TraceLoader.js';
 import * as TimelineUtils from '../timeline/utils/utils.js';
 
-import {DrJonesPerformanceAgent, ResponseType} from './freestyler.js';
+import {CallTreeContext, DrJonesPerformanceAgent, ResponseType} from './freestyler.js';
 
 describeWithEnvironment('DrJonesPerformanceAgent', () => {
   function mockHostConfig(modelId?: string, temperature?: number) {
     getGetHostConfigStub({
-      devToolsAiAssistancePerformanceAgentDogfood: {
+      devToolsAiAssistancePerformanceAgent: {
         modelId,
         temperature,
       },
@@ -63,19 +63,20 @@ describeWithEnvironment('DrJonesPerformanceAgent', () => {
         serverSideLoggingEnabled: true,
       });
       sinon.stub(agent, 'preamble').value('preamble');
-      agent.chatNewHistoryForTesting = new Map([[
-        0,
-        [
-          {
-            type: ResponseType.QUERYING,
-            query: 'question',
-          },
-          {
-            type: ResponseType.ANSWER,
-            text: 'answer',
-          },
-        ],
-      ]]);
+      agent.chatNewHistoryForTesting = [
+        {
+          type: ResponseType.USER_QUERY,
+          query: 'question',
+        },
+        {
+          type: ResponseType.QUERYING,
+          query: 'question',
+        },
+        {
+          type: ResponseType.ANSWER,
+          text: 'answer',
+        },
+      ];
       assert.deepStrictEqual(
           agent.buildRequest({
             input: 'test input',
@@ -133,7 +134,7 @@ describeWithEnvironment('DrJonesPerformanceAgent', () => {
         aidaClient: mockAidaClient(generateAnswer),
       });
 
-      const responses = await Array.fromAsync(agent.run('test', {selected: aiCallTree}));
+      const responses = await Array.fromAsync(agent.run('test', {selected: new CallTreeContext(aiCallTree)}));
       const expectedData = '\n\n' +
           `
 
@@ -198,42 +199,43 @@ self: 3
         serialize: () => 'Mock call tree',
       } as unknown as TimelineUtils.AICallTree.AICallTree;
 
-      const enhancedQuery1 = await agent.enhanceQuery('What is this?', mockAiCallTree);
+      const enhancedQuery1 = await agent.enhanceQuery('What is this?', new CallTreeContext(mockAiCallTree));
       assert.strictEqual(enhancedQuery1, 'Mock call tree\n\n# User request\n\nWhat is this?');
 
       // Create history state of the above query
-      agent.chatNewHistoryForTesting = new Map([[
-        0,
-        [
-          {
-            type: ResponseType.CONTEXT,
-            title: 'Analyzing call tree',
-            details: [
-              {
-                title: 'Selected call tree',
-                text: mockAiCallTree.serialize(),
-              },
-            ],
-          },
-          {
-            type: ResponseType.QUERYING,
-            query: enhancedQuery1,
-          },
-          {
-            type: ResponseType.ANSWER,
-            text: 'test answer',
-          },
-        ],
-      ]]);
+      agent.chatNewHistoryForTesting = [
+        {
+          type: ResponseType.USER_QUERY,
+          query: 'What is this?',
+        },
+        {
+          type: ResponseType.CONTEXT,
+          title: 'Analyzing call tree',
+          details: [
+            {
+              title: 'Selected call tree',
+              text: mockAiCallTree.serialize(),
+            },
+          ],
+        },
+        {
+          type: ResponseType.QUERYING,
+          query: enhancedQuery1,
+        },
+        {
+          type: ResponseType.ANSWER,
+          text: 'test answer',
+        },
+      ];
 
       const query2 = 'But what about this follow-up question?';
-      const enhancedQuery2 = await agent.enhanceQuery(query2, mockAiCallTree);
+      const enhancedQuery2 = await agent.enhanceQuery(query2, new CallTreeContext(mockAiCallTree));
       assert.strictEqual(enhancedQuery2, query2);
       assert.isFalse(enhancedQuery2.includes(mockAiCallTree.serialize()));
 
       // Just making sure any subsequent chat doesnt include it either.
       const query3 = 'And this 3rd question?';
-      const enhancedQuery3 = await agent.enhanceQuery(query3, mockAiCallTree);
+      const enhancedQuery3 = await agent.enhanceQuery(query3, new CallTreeContext(mockAiCallTree));
       assert.strictEqual(enhancedQuery3, query3);
       assert.isFalse(enhancedQuery3.includes(mockAiCallTree.serialize()));
     });

package/front_end/panels/freestyler/DrJonesPerformanceAgent.ts

@@ -5,14 +5,16 @@
 import * as Common from '../../core/common/common.js';
 import * as Host from '../../core/host/host.js';
 import * as i18n from '../../core/i18n/i18n.js';
-import type * as TimelineUtils from '../../panels/timeline/utils/utils.js';
+import * as TimelineUtils from '../../panels/timeline/utils/utils.js';
+import * as PanelUtils from '../utils/utils.js';
 
 import {
   AgentType,
   AiAgent,
-  type AidaRequestOptions,
   type ContextResponse,
+  ConversationContext,
   type ParsedResponse,
+  type RequestOptions,
   ResponseType,
 } from './AiAgent.js';
 
@@ -120,22 +122,59 @@ const UIStringsNotTranslate = {
 
 const lockedString = i18n.i18n.lockedString;
 
+export class CallTreeContext extends ConversationContext<TimelineUtils.AICallTree.AICallTree> {
+  #callTree: TimelineUtils.AICallTree.AICallTree;
+
+  constructor(callTree: TimelineUtils.AICallTree.AICallTree) {
+    super();
+    this.#callTree = callTree;
+  }
+
+  override getOrigin(): string {
+    // TODO: implement cross-origin checks for the PerformanceAgent.
+    return '';
+  }
+
+  override getItem(): TimelineUtils.AICallTree.AICallTree {
+    return this.#callTree;
+  }
+
+  override getIcon(): HTMLElement {
+    const iconData = {
+      iconName: 'performance',
+      color: 'var(--sys-color-on-surface-subtle)',
+    };
+    const icon = PanelUtils.PanelUtils.createIconElement(iconData, 'Performance');
+    icon.classList.add('icon');
+    return icon;
+  }
+
+  override getTitle(): string {
+    const {event} = this.#callTree.selectedNode;
+    if (!event) {
+      return 'unknown';
+    }
+
+    return TimelineUtils.EntryName.nameForEntry(event);
+  }
+}
+
 /**
  * One agent instance handles one conversation. Create a new agent
  * instance for a new conversation.
  */
 export class DrJonesPerformanceAgent extends AiAgent<TimelineUtils.AICallTree.AICallTree> {
-  override type = AgentType.DRJONES_PERFORMANCE;
+  override readonly type = AgentType.DRJONES_PERFORMANCE;
   readonly preamble = preamble;
   readonly clientFeature = Host.AidaClient.ClientFeature.CHROME_DRJONES_PERFORMANCE_AGENT;
   get userTier(): string|undefined {
     const config = Common.Settings.Settings.instance().getHostConfig();
-    return config.devToolsAiAssistancePerformanceAgentDogfood?.userTier;
+    return config.devToolsAiAssistancePerformanceAgent?.userTier;
   }
-  get options(): AidaRequestOptions {
+  get options(): RequestOptions {
     const config = Common.Settings.Settings.instance().getHostConfig();
-    const temperature = config.devToolsAiAssistancePerformanceAgentDogfood?.temperature;
-    const modelId = config.devToolsAiAssistancePerformanceAgentDogfood?.modelId;
+    const temperature = config.devToolsAiAssistancePerformanceAgent?.temperature;
+    const modelId = config.devToolsAiAssistancePerformanceAgent?.modelId;
 
     return {
       temperature,
@@ -144,7 +183,7 @@ export class DrJonesPerformanceAgent extends AiAgent<TimelineUtils.AICallTree.AI
   }
 
   async *
-      handleContextDetails(aiCallTree: TimelineUtils.AICallTree.AICallTree|null):
+      handleContextDetails(aiCallTree: ConversationContext<TimelineUtils.AICallTree.AICallTree>|null):
           AsyncGenerator<ContextResponse, void, void> {
     yield {
       type: ResponseType.CONTEXT,
@@ -152,14 +191,15 @@ export class DrJonesPerformanceAgent extends AiAgent<TimelineUtils.AICallTree.AI
       details: [
         {
           title: 'Selected call tree',
-          text: aiCallTree?.serialize() ?? '',
+          text: aiCallTree?.getItem().serialize() ?? '',
         },
       ],
     };
   }
 
-  override async enhanceQuery(query: string, aiCallTree: TimelineUtils.AICallTree.AICallTree|null): Promise<string> {
-    const treeStr = aiCallTree?.serialize();
+  override async enhanceQuery(query: string, aiCallTree: ConversationContext<TimelineUtils.AICallTree.AICallTree>|null):
+      Promise<string> {
+    const treeStr = aiCallTree?.getItem().serialize();
 
     // Collect the queries from previous messages in this session
     const prevQueries: string[] = [];
@@ -184,14 +224,3 @@ export class DrJonesPerformanceAgent extends AiAgent<TimelineUtils.AICallTree.AI
     };
   }
 }
-
-function setDebugFreestylerEnabled(enabled: boolean): void {
-  if (enabled) {
-    localStorage.setItem('debugFreestylerEnabled', 'true');
-  } else {
-    localStorage.removeItem('debugFreestylerEnabled');
-  }
-}
-
-// @ts-ignore
-globalThis.setDebugFreestylerEnabled = setDebugFreestylerEnabled;