[AI Assistance] Add for "deployed" files how they are loaded by adding request initiator chain as part of the context sent to AIDA

Bug: 373594521
Change-Id: I38ae306335f3c8d45ec6d5655226799fda48a345
Fixed: 373594521
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/6090774
Reviewed-by: Alex Rudenko <[email protected]>
Commit-Queue: Samiya Caur <[email protected]>

Author: Samiya Caur

front_end/panels/ai_assistance/agents/FileAgent.test.ts

@@ -6,7 +6,9 @@ import * as Common from '../../../core/common/common.js';
 import * as Host from '../../../core/host/host.js';
 import type * as Platform from '../../../core/platform/platform.js';
 import * as SDK from '../../../core/sdk/sdk.js';
+import type * as Protocol from '../../../generated/protocol.js';
 import * as Bindings from '../../../models/bindings/bindings.js';
+import * as Logs from '../../../models/logs/logs.js';
 import * as Workspace from '../../../models/workspace/workspace.js';
 import {
   createTarget,
@@ -48,6 +50,10 @@ describeWithMockConnection('FileAgent', () => {
     Bindings.IgnoreListManager.IgnoreListManager.instance({forceNew: true, debuggerWorkspaceBinding});
   });
 
+  afterEach(() => {
+    sinon.restore();
+  });
+
   describe('buildRequest', () => {
     beforeEach(() => {
       sinon.restore();
@@ -164,6 +170,52 @@ describeWithMockConnection('FileAgent', () => {
     return uiSourceCode;
   }
 
+  function createNetworkRequest(): SDK.NetworkRequest.NetworkRequest {
+    const networkRequest = SDK.NetworkRequest.NetworkRequest.create(
+        'requestId' as Protocol.Network.RequestId,
+        'https://www.example.com/script.js' as Platform.DevToolsPath.UrlString, '' as Platform.DevToolsPath.UrlString,
+        null, null, null);
+    networkRequest.statusCode = 200;
+    networkRequest.setRequestHeaders([{name: 'content-type', value: 'bar1'}]);
+    networkRequest.responseHeaders = [{name: 'content-type', value: 'bar2'}, {name: 'x-forwarded-for', value: 'bar3'}];
+
+    const initiatorNetworkRequest = SDK.NetworkRequest.NetworkRequest.create(
+        'requestId' as Protocol.Network.RequestId, 'https://www.initiator.com' as Platform.DevToolsPath.UrlString,
+        '' as Platform.DevToolsPath.UrlString, null, null, null);
+    const initiatedNetworkRequest1 = SDK.NetworkRequest.NetworkRequest.create(
+        'requestId' as Protocol.Network.RequestId, 'https://www.example.com/1' as Platform.DevToolsPath.UrlString,
+        '' as Platform.DevToolsPath.UrlString, null, null, null);
+    const initiatedNetworkRequest2 = SDK.NetworkRequest.NetworkRequest.create(
+        'requestId' as Protocol.Network.RequestId, 'https://www.example.com/2' as Platform.DevToolsPath.UrlString,
+        '' as Platform.DevToolsPath.UrlString, null, null, null);
+
+    sinon.stub(Logs.NetworkLog.NetworkLog.instance(), 'initiatorGraphForRequest')
+        .withArgs(networkRequest)
+        .returns({
+          initiators: new Set([networkRequest, initiatorNetworkRequest]),
+          initiated: new Map([
+            [networkRequest, initiatorNetworkRequest],
+            [initiatedNetworkRequest1, networkRequest],
+            [initiatedNetworkRequest2, networkRequest],
+          ]),
+        })
+        .withArgs(initiatedNetworkRequest1)
+        .returns({
+          initiators: new Set([]),
+          initiated: new Map([
+            [initiatedNetworkRequest1, networkRequest],
+          ]),
+        })
+        .withArgs(initiatedNetworkRequest2)
+        .returns({
+          initiators: new Set([]),
+          initiated: new Map([
+            [initiatedNetworkRequest2, networkRequest],
+          ]),
+        });
+    return networkRequest;
+  }
+
   describe('run', () => {
     const testArguments = [
       {
@@ -297,6 +349,29 @@ lorem ipsum
 \`\`\``);
     });
 
+    it('formats file with associated request initiator chain', async () => {
+      const networkRequest = createNetworkRequest();
+      const uiSourceCode = await createUISourceCode({
+        content: 'lorem ipsum',
+        requestContentData: true,
+        url: networkRequest.url(),
+      });
+      sinon.stub(SDK.ResourceTreeModel.ResourceTreeModel.prototype, 'resourceForURL')
+          .withArgs(networkRequest.url())
+          .returns({request: networkRequest} as SDK.Resource.Resource);
+      assert.strictEqual(formatFile(uiSourceCode), `File name: script.js
+URL: https://www.example.com/script.js
+Request initiator chain:
+- URL: <redacted cross-origin initiator URL>
+\t- URL: https://www.example.com/script.js
+\t\t- URL: https://www.example.com/1
+\t\t- URL: https://www.example.com/2
+File content:
+\`\`\`
+lorem ipsum
+\`\`\``);
+    });
+
     it('formats file content of a binary file', async () => {
       const uiSourceCode = await createUISourceCode({
         resourceType: Common.ResourceType.resourceTypes.Image,

front_end/panels/ai_assistance/agents/FileAgent.ts

@@ -18,17 +18,20 @@ import {
   type RequestOptions,
   ResponseType,
 } from './AiAgent.js';
+import {formatRequestInitiatorChain} from './NetworkAgent.js';
 
 const preamble =
     `You are a highly skilled software engineer with expertise in various programming languages and frameworks.
 You are provided with the content of a file from the Chrome DevTools Sources panel. To aid your analysis, you've been given the below links to understand the context of the code and its relationship to other files. When answering questions, prioritize providing these links directly.
 * Source-mapped from: If this code is the source for a mapped file, you'll have a link to that generated file.
 * Source map: If this code has an associated source map, you'll have link to the source map.
+* If there is a request which caused the file to be loaded, you will be provided with the request initiator chain with URLs for those requests.
 
 Analyze the code and provide the following information:
 * Describe the primary functionality of the code. What does it do? Be specific and concise. If the code snippet is too small or unclear to determine the functionality, state that explicitly.
 * If possible, identify the framework or library the code is associated with (e.g., React, Angular, jQuery). List any key technologies, APIs, or patterns used in the code (e.g., Fetch API, WebSockets, object-oriented programming).
 * (Only provide if available and accessible externally) External Resources: Suggest relevant documentation that could help a developer understand the code better. Prioritize official documentation if available. Do not provide any internal resources.
+* (ONLY if request initiator chain is provided) Why the file was loaded?
 
 # Considerations
 * Keep your analysis concise and focused, highlighting only the most critical aspects for a software engineer.
@@ -161,9 +164,14 @@ export function formatFile(selectedFile: Workspace.UISourceCode.UISourceCode): s
     `File name: ${selectedFile.displayName()}`,
     `URL: ${selectedFile.url()}`,
     sourceMapDetails,
-    `File content:
-${formatFileContent(selectedFile)}`,
   ];
+  const resource = Bindings.ResourceUtils.resourceForURL(selectedFile.url());
+  if (resource?.request) {
+    lines.push(`Request initiator chain:
+${formatRequestInitiatorChain(resource?.request)}`);
+  }
+  lines.push(`File content:
+${formatFileContent(selectedFile)}`);
   return lines.filter(line => line.trim() !== '').join('\n');
 }
 
@@ -196,7 +204,7 @@ export function formatSourceMapDetails(
     }
   } else if (selectedFile.contentType().isScript()) {
     for (const script of debuggerWorkspaceBinding.scriptsForUISourceCode(selectedFile)) {
-      if (script.sourceMapURL !== undefined) {
+      if (script.sourceMapURL !== undefined && script.sourceMapURL !== '') {
         sourceMapUrls.push(script.sourceMapURL);
       }
     }

front_end/panels/ai_assistance/agents/NetworkAgent.ts

@@ -378,7 +378,7 @@ function formatRequestInitiated(
  * Note: nothing here should include information from origins other than
  * the request's origin.
  */
-function formatRequestInitiatorChain(request: SDK.NetworkRequest.NetworkRequest): string {
+export function formatRequestInitiatorChain(request: SDK.NetworkRequest.NetworkRequest): string {
   const allowedOrigin = new URL(request.url()).origin;
   let initiatorChain = '';
   let lineStart = '- URL: ';