chrome-devtools-frontend 1.0.1380117 → 1.0.1386602

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

@@ -517,19 +517,20 @@ c`;
         serverSideLoggingEnabled: true,
       });
       sinon.stub(agent, 'preamble').value('preamble');
-      agent.chatNewHistoryForTesting = new Map([[
-        0,
-        [
-          {
-            type: Freestyler.ResponseType.QUERYING,
-            query: 'question',
-          },
-          {
-            type: Freestyler.ResponseType.ANSWER,
-            text: 'answer',
-          },
-        ],
-      ]]);
+      agent.chatNewHistoryForTesting = [
+        {
+          type: Freestyler.ResponseType.USER_QUERY,
+          query: 'question',
+        },
+        {
+          type: Freestyler.ResponseType.QUERYING,
+          query: 'question',
+        },
+        {
+          type: Freestyler.ResponseType.ANSWER,
+          text: 'answer',
+        },
+      ];
       assert.deepStrictEqual(
           agent.buildRequest({
             input: 'test input',
@@ -565,7 +566,8 @@ c`;
   });
 
   function mockAidaClient(
-      fetch: (_: unknown, options?: {signal: AbortSignal}) => AsyncGenerator<Host.AidaClient.AidaResponse, void, void>,
+      fetch: (_: Host.AidaClient.AidaRequest, options?: {signal: AbortSignal}) =>
+          AsyncGenerator<Host.AidaClient.AidaResponse, void, void>,
       ): Host.AidaClient.AidaClient {
     return {
       fetch,
@@ -797,6 +799,63 @@ c`;
       ]);
     });
 
+    it('correctly handles chat_history in AIDA requests', async () => {
+      const requests: Host.AidaClient.AidaRequest[] = [];
+
+      let i = 0;
+      async function* generateAnswer(request: Host.AidaClient.AidaRequest) {
+        requests.push(request);
+        if (i !== 0) {
+          yield {
+            explanation: 'ANSWER: this is the actual answer',
+            metadata: {},
+            completed: true,
+          };
+          return;
+        }
+        yield {
+          explanation: `THOUGHT: I am thinking.
+TITLE: thinking
+ACTION
+const data = {"test": "observation"};
+STOP`,
+          metadata: {},
+          completed: false,
+        };
+        i++;
+      }
+
+      const execJs = sinon.mock().once();
+      execJs.onCall(0).returns('test data');
+      const agent = new FreestylerAgent({
+        aidaClient: mockAidaClient(generateAnswer),
+        createExtensionScope,
+        execJs,
+      });
+
+      await Array.fromAsync(agent.run('test', {selected: new Freestyler.NodeContext(element)}));
+
+      assert.lengthOf(requests, 2, 'Unexpected number of AIDA requests');
+      assert.isUndefined(requests[0].chat_history, 'Unexpected chat history in the initial request');
+      assert.strictEqual(
+          requests[0].input, '# Inspected element\n\n* Its selector is `undefined`\n\n# User request\n\nQUERY: test',
+          'Unexpected input in the initial request');
+      assert.deepStrictEqual(
+          requests[1].chat_history,
+          [
+            {
+              entity: 1,
+              text: '# Inspected element\n\n* Its selector is `undefined`\n\n# User request\n\nQUERY: test',
+            },
+            {
+              entity: 2,
+              text: 'THOUGHT: I am thinking.\nTITLE: thinking\nACTION\nconst data = {\"test\": \"observation\"};\nSTOP',
+            },
+          ],
+          'Unexpected chat history in the follow-up request');
+      assert.strictEqual(requests[1].input, 'OBSERVATION: test data', 'Unexpected input in the follow-up request');
+    });
+
     it('generates an rpcId for the answer', async () => {
       async function* generateAnswer() {
         yield {
@@ -942,6 +1001,43 @@ c`;
       ]);
     });
 
+    it('should execute an action only once even when the partial response contains an action', async () => {
+      const execJs = sinon.spy();
+      async function* generatePartialAndFullAction() {
+        yield {
+          explanation: `THOUGHT: I am thinking.
+
+ACTION
+console.log('hel
+          `,
+          metadata: {},
+          completed: false,
+        };
+
+        sinon.assert.notCalled(execJs);
+        yield {
+          explanation: `THOUGHT: I am thinking.
+
+ACTION
+console.log('hello');
+STOP
+          `,
+          metadata: {},
+          completed: true,
+        };
+      }
+
+      const agent = new FreestylerAgent({
+        aidaClient: mockAidaClient(generatePartialAndFullAction),
+        createExtensionScope,
+        execJs,
+      });
+      await Array.fromAsync(agent.run('test', {selected: new Freestyler.NodeContext(element)}));
+
+      sinon.assert.calledOnce(execJs);
+      assert.include(execJs.lastCall.args[0], 'console.log(\'hello\');');
+    });
+
     it('generates a response if nothing is returned', async () => {
       async function* generateNothing() {
         yield {
@@ -1168,6 +1264,91 @@ ANSWER: this is the answer`,
     });
   });
 
+  describe('history', () => {
+    let element: sinon.SinonStubbedInstance<SDK.DOMModel.DOMNode>;
+    beforeEach(() => {
+      mockHostConfig();
+      element = sinon.createStubInstance(SDK.DOMModel.DOMNode);
+      // @ts-ignore
+      setAiAssistancePersistentHistory(true);
+    });
+
+    it('stores history via AiHistoryStorage', async () => {
+      let count = 0;
+      async function* generateMultipleTimes() {
+        if (count === 1) {
+          yield {
+            explanation: 'ANSWER: this is the answer',
+            metadata: {},
+            completed: true,
+          };
+          return;
+        }
+        count++;
+        yield {
+          explanation: `THOUGHT: thought ${count}\nTITLE:test\nACTION\nconsole.log('test')\nSTOP\n`,
+          metadata: {},
+          completed: false,
+        };
+      }
+      const historyStub = sinon.stub(Freestyler.AiHistoryStorage.instance(), 'upsertHistoryEntry');
+      const execJs = sinon.spy(async () => 'undefined');
+      const agent = new FreestylerAgent({
+        aidaClient: mockAidaClient(generateMultipleTimes),
+        createExtensionScope,
+        execJs,
+      });
+
+      await Array.fromAsync(agent.run('test', {selected: new Freestyler.NodeContext(element)}));
+
+      assert.deepStrictEqual(historyStub.lastCall.args[0].history, [
+        {
+          type: Freestyler.ResponseType.USER_QUERY,
+          query: 'test',
+        },
+        {
+          type: Freestyler.ResponseType.CONTEXT,
+          title: 'Analyzing the prompt',
+          details: [{
+            text: '* Its selector is `undefined`',
+            title: 'Data used',
+          }],
+        },
+        {
+          type: Freestyler.ResponseType.QUERYING,
+          query: '# Inspected element\n\n* Its selector is `undefined`\n\n# User request\n\nQUERY: test',
+        },
+        {
+          type: Freestyler.ResponseType.TITLE,
+          title: 'test',
+          rpcId: undefined,
+        },
+        {
+          type: Freestyler.ResponseType.THOUGHT,
+          thought: 'thought 1',
+          rpcId: undefined,
+        },
+        {
+          type: Freestyler.ResponseType.ACTION,
+          code: 'console.log(\'test\')',
+          output: 'undefined',
+          canceled: false,
+          rpcId: undefined,
+        },
+        {
+          type: Freestyler.ResponseType.QUERYING,
+          query: 'OBSERVATION: undefined',
+        },
+        {
+          type: Freestyler.ResponseType.ANSWER,
+          text: 'this is the answer',
+          suggestions: undefined,
+          rpcId: undefined,
+        },
+      ]);
+    });
+  });
+
   describe('HostConfigFreestylerExecutionMode', () => {
     let element: sinon.SinonStubbedInstance<SDK.DOMModel.DOMNode>;
     beforeEach(() => {

package/front_end/panels/freestyler/FreestylerAgent.ts

@@ -13,14 +13,15 @@ import * as LitHtml from '../../ui/lit-html/lit-html.js';
 
 import {
   type ActionResponse,
+  type AgentOptions as BaseAgentOptions,
   AgentType,
   AiAgent,
-  type AidaRequestOptions,
   type ContextResponse,
   ConversationContext,
   debugLog,
-  isDebugMode,
   type ParsedResponse,
+  type ParsedResponseAnswer,
+  type RequestOptions,
   ResponseType,
   type SideEffectResponse,
 } from './AiAgent.js';
@@ -201,14 +202,12 @@ type CreateExtensionScopeFunction = (changes: ChangeManager) => {
   install(): Promise<void>, uninstall(): Promise<void>,
 };
 
-type AgentOptions = {
-  aidaClient: Host.AidaClient.AidaClient,
-  changeManager?: ChangeManager,
-  confirmSideEffectForTest?: typeof Promise.withResolvers,
-  serverSideLoggingEnabled?: boolean,
-  createExtensionScope?: CreateExtensionScopeFunction,
-  execJs?: typeof executeJsCode,
-};
+interface AgentOptions extends BaseAgentOptions {
+  changeManager?: ChangeManager;
+  confirmSideEffectForTest?: typeof Promise.withResolvers;
+  createExtensionScope?: CreateExtensionScopeFunction;
+  execJs?: typeof executeJsCode;
+}
 
 export class NodeContext extends ConversationContext<SDK.DOMModel.DOMNode> {
   #node: SDK.DOMModel.DOMNode;
@@ -247,7 +246,7 @@ export class NodeContext extends ConversationContext<SDK.DOMModel.DOMNode> {
  * instance for a new conversation.
  */
 export class FreestylerAgent extends AiAgent<SDK.DOMModel.DOMNode> {
-  override type = AgentType.FREESTYLER;
+  override readonly type = AgentType.FREESTYLER;
 
   readonly preamble = preamble;
   readonly clientFeature = Host.AidaClient.ClientFeature.CHROME_FREESTYLER;
@@ -262,7 +261,7 @@ export class FreestylerAgent extends AiAgent<SDK.DOMModel.DOMNode> {
     return config.devToolsFreestyler?.executionMode ?? Root.Runtime.HostConfigFreestylerExecutionMode.ALL_SCRIPTS;
   }
 
-  get options(): AidaRequestOptions {
+  get options(): RequestOptions {
     const config = Common.Settings.Settings.instance().getHostConfig();
     const temperature = config.devToolsFreestyler?.temperature;
     const modelId = config.devToolsFreestyler?.modelId;
@@ -611,10 +610,6 @@ export class FreestylerAgent extends AiAgent<SDK.DOMModel.DOMNode> {
         }
 
         const sideEffectConfirmationPromiseWithResolvers = this.#confirmSideEffect<boolean>();
-        if (isDebugMode()) {
-          window.dispatchEvent(new CustomEvent(
-              'freestylersideeffect', {detail: {confirm: sideEffectConfirmationPromiseWithResolvers.resolve}}));
-        }
 
         yield {
           type: ResponseType.SIDE_EFFECT,
@@ -671,7 +666,7 @@ export class FreestylerAgent extends AiAgent<SDK.DOMModel.DOMNode> {
     return `${elementEnchantmentQuery}QUERY: ${query}`;
   }
 
-  override formatHistoryChunkAnswer(text: string): string {
-    return `ANSWER: ${text}`;
+  override formatParsedResponseAnswer(step: ParsedResponseAnswer): string {
+    return `ANSWER: ${step.answer}`;
   }
 }

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

@@ -896,6 +896,7 @@ describeWithEnvironment('FreestylerPanel', () => {
     const menuItem = findMenuItemWithLabel(contextMenu.defaultSection(), 'No past conversations');
     assert(menuItem);
   });
+
   describe('cross-origin', () => {
     it('blocks input on cross origin requests', async () => {
       const networkRequest = sinon.createStubInstance(SDK.NetworkRequest.NetworkRequest, {
@@ -934,6 +935,76 @@ describeWithEnvironment('FreestylerPanel', () => {
         blockedByCrossOrigin: true,
       }));
     });
+
+    it('should be able to continue same-origin requests', async () => {
+      const stub = getGetHostConfigStub({
+        devToolsFreestyler: {
+          enabled: true,
+        },
+      });
+      panel = new Freestyler.FreestylerPanel(mockView, {
+        aidaClient: getTestAidaClient(),
+        aidaAvailability: Host.AidaClient.AidaAccessPreconditions.AVAILABLE,
+        syncInfo: getTestSyncInfo(),
+      });
+      UI.Context.Context.instance().setFlavor(
+          ElementsPanel.ElementsPanel.ElementsPanel,
+          sinon.createStubInstance(ElementsPanel.ElementsPanel.ElementsPanel));
+
+      panel.handleAction('freestyler.elements-floating-button');
+      mockView.lastCall.args[0].onTextSubmit('test');
+      await drainMicroTasks();
+
+      assert.deepEqual(mockView.lastCall.args[0].messages, [
+        {
+          entity: Freestyler.ChatMessageEntity.USER,
+          text: 'test',
+        },
+        {
+          answer: 'test',
+          entity: Freestyler.ChatMessageEntity.MODEL,
+          rpcId: undefined,
+          suggestions: undefined,
+          steps: [],
+        },
+      ]);
+
+      UI.Context.Context.instance().setFlavor(
+          ElementsPanel.ElementsPanel.ElementsPanel,
+          sinon.createStubInstance(ElementsPanel.ElementsPanel.ElementsPanel));
+
+      panel.handleAction('freestyler.elements-floating-button');
+      mockView.lastCall.args[0].onTextSubmit('test2');
+      await drainMicroTasks();
+
+      assert.strictEqual(mockView.lastCall.args[0].isReadOnly, false);
+      assert.deepEqual(mockView.lastCall.args[0].messages, [
+        {
+          entity: Freestyler.ChatMessageEntity.USER,
+          text: 'test',
+        },
+        {
+          answer: 'test',
+          entity: Freestyler.ChatMessageEntity.MODEL,
+          rpcId: undefined,
+          suggestions: undefined,
+          steps: [],
+        },
+        {
+          entity: Freestyler.ChatMessageEntity.USER,
+          text: 'test2',
+        },
+        {
+          answer: 'test',
+          entity: Freestyler.ChatMessageEntity.MODEL,
+          rpcId: undefined,
+          suggestions: undefined,
+          steps: [],
+        },
+      ]);
+
+      stub.restore();
+    });
   });
 
   describe('auto agent selection for panels', () => {