chrome-devtools-frontend 1.0.1635648 → 1.0.1636056

package/.agents/skills/verification/SKILL.md

@@ -1,6 +1,6 @@
 ---
 name: devtools-verification
-description: MANDATORY: Activate this skill ANY TIME you need to build the project, run tests, or verify code health in DevTools. You MUST use this skill before executing commands like npm test, npm run build, autoninja, or linters, as it contains critical, repository-specific instructions on how to correctly format these commands, filter test runs, and interpret failures.
+description: "MANDATORY: Activate this skill ANY TIME you need to build the project, run tests, or verify code health in DevTools. You MUST use this skill before executing commands like npm test, npm run build, autoninja, or linters, as it contains critical, repository-specific instructions on how to correctly format these commands, filter test runs, and interpret failures."
 ---
 
 # Instructions on how to verify your changes

package/front_end/core/i18n/collect-ui-strings.js

@@ -2,7 +2,7 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
-import glob from 'glob';
+import {globSync} from 'node:fs';
 import * as path from 'node:path';
 import yargs from 'yargs';
 import {hideBin} from 'yargs/helpers';
@@ -68,9 +68,9 @@ for (const directory of inputDirectories) {
     ...collectAllStringsInDir(directory),
   };
 
-  const fs = glob.sync('**/*.{js,ts,gn}', {
+  const fs = globSync('**/*.{js,ts,gn}', {
     cwd: directory,
-    ignore: IGNORED_PATH_COMPONENTS,
+    exclude: IGNORED_PATH_COMPONENTS,
   });
   files.push(...fs.map(f => path.join(directory, f)));
 }

package/front_end/core/root/Runtime.ts

@@ -625,6 +625,10 @@ interface UseGcaApi {
   enabled: boolean;
 }
 
+interface DevToolsAIV2Architecture {
+  enabled: boolean;
+}
+
 interface DevToolsProtocolMonitor {
   enabled: boolean;
 }
@@ -663,6 +667,7 @@ export type HostConfig = Platform.TypeScriptUtilities.RecursivePartial<{
   devToolsAiAssistanceAccessibilityAgent: HostConfigAiAssistanceAccessibilityAgent,
   devToolsAiAssistanceStorageAgent: HostConfigAiAssistanceStorageAgent,
   devToolsAiAssistanceV2: HostConfigAiAssistanceV2,
+  devToolsAIV2Architecture: DevToolsAIV2Architecture,
   devToolsAiCodeCompletion: HostConfigAiCodeCompletion,
   devToolsAiCodeGeneration: HostConfigAiCodeGeneration,
   devToolsAiCodeCompletionStyles: HostConfigAiCodeCompletionStyles,

package/front_end/core/sdk/SourceMapCache.ts

@@ -2,6 +2,8 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
+import type * as Platform from '../platform/platform.js';
+
 import type {DebugId, SourceMapV3} from './SourceMap.js';
 
 /** A thin wrapper around the Cache API to store source map JSONs keyed on Debug IDs */
@@ -28,14 +30,14 @@ export class SourceMapCache {
     this.#name = name;
   }
 
-  async set(debugId: DebugId, sourceMap: SourceMapV3): Promise<void> {
+  async set(debugId: DebugId, securityOrigin: Platform.DevToolsPath.UrlString, sourceMap: SourceMapV3): Promise<void> {
     const cache = await this.#cache();
-    await cache.put(SourceMapCache.#urlForDebugId(debugId), new Response(JSON.stringify(sourceMap)));
+    await cache.put(SourceMapCache.#urlForDebugId(debugId, securityOrigin), new Response(JSON.stringify(sourceMap)));
   }
 
-  async get(debugId: DebugId): Promise<SourceMapV3|null> {
+  async get(debugId: DebugId, securityOrigin: Platform.DevToolsPath.UrlString): Promise<SourceMapV3|null> {
     const cache = await this.#cache();
-    const response = await cache.match(SourceMapCache.#urlForDebugId(debugId));
+    const response = await cache.match(SourceMapCache.#urlForDebugId(debugId, securityOrigin));
     return await response?.json() ?? null;
   }
 
@@ -49,8 +51,8 @@ export class SourceMapCache {
   }
 
   /** The Cache API only allows URL as keys, so we construct a simple one. Given that we have our own cache, we have no risk of conflicting URLs */
-  static #urlForDebugId(debugId: DebugId): string {
-    return 'http://debug.id/' + encodeURIComponent(debugId);
+  static #urlForDebugId(debugId: DebugId, securityOrigin: Platform.DevToolsPath.UrlString): string {
+    return `http://debug.id/${encodeURIComponent(debugId)}?origin=${encodeURIComponent(securityOrigin)}`;
   }
 
   async disposeForTest(): Promise<void> {
@@ -59,14 +61,14 @@ export class SourceMapCache {
 }
 
 const IN_MEMORY_INSTANCE = new (class implements Pick<SourceMapCache, 'get'|'set'|'disposeForTest'> {
-  readonly #cache = new Map<DebugId, SourceMapV3>();
+  readonly #cache = new Map<string, SourceMapV3>();
 
-  async set(debugId: DebugId, sourceMap: SourceMapV3): Promise<void> {
-    this.#cache.set(debugId, sourceMap);
+  async set(debugId: DebugId, securityOrigin: Platform.DevToolsPath.UrlString, sourceMap: SourceMapV3): Promise<void> {
+    this.#cache.set(`${debugId}|${securityOrigin}`, sourceMap);
   }
 
-  async get(debugId: DebugId): Promise<SourceMapV3|null> {
-    return this.#cache.get(debugId) ?? null;
+  async get(debugId: DebugId, securityOrigin: Platform.DevToolsPath.UrlString): Promise<SourceMapV3|null> {
+    return this.#cache.get(`${debugId}|${securityOrigin}`) ?? null;
   }
 
   async disposeForTest(): Promise<void> {

package/front_end/core/sdk/SourceMapManager.ts

@@ -190,7 +190,9 @@ async function loadSourceMap(
     initiator: PageResourceLoadInitiator): Promise<SourceMapV3> {
   try {
     if (debugId) {
-      const cachedSourceMap = await SourceMapCache.instance().get(debugId);
+      const securityOrigin = initiator.initiatorUrl ? Common.ParsedURL.ParsedURL.extractOrigin(initiator.initiatorUrl) :
+                                                      Platform.DevToolsPath.EmptyUrlString;
+      const cachedSourceMap = await SourceMapCache.instance().get(debugId, securityOrigin);
       if (cachedSourceMap) {
         return cachedSourceMap;
       }
@@ -198,9 +200,11 @@ async function loadSourceMap(
 
     const {content} = await resourceLoader.loadResource(url, initiator);
     const sourceMap = parseSourceMap(content);
-    if ('debugId' in sourceMap && sourceMap.debugId) {
+    if (debugId && 'debugId' in sourceMap && sourceMap.debugId === debugId) {
       // In case something goes wrong with updating the cache, we still want to use the source map.
-      await SourceMapCache.instance().set(sourceMap.debugId as DebugId, sourceMap).catch();
+      const securityOrigin = initiator.initiatorUrl ? Common.ParsedURL.ParsedURL.extractOrigin(initiator.initiatorUrl) :
+                                                      Platform.DevToolsPath.EmptyUrlString;
+      await SourceMapCache.instance().set(sourceMap.debugId as DebugId, securityOrigin, sourceMap).catch();
     }
     return sourceMap;
   } catch (cause) {

package/front_end/entrypoints/greendev_floaty/FloatyEntrypoint.ts

@@ -45,6 +45,9 @@ class GreenDevFloaty {
   #backendNodeId?: Protocol.DOM.BackendNodeId;
   #syncChannel: BroadcastChannel;
   #isFloatyWindow: boolean;
+  #socketClient:
+      AiAssistance.GreenDevAgentAntigravityCliSocketClient.GreenDevAgentAntigravityCliSocketClient|
+      AiAssistance.GreenDevAgentGeminiCliSocketClient.GreenDevAgentGeminiCliSocketClient;
 
   constructor(document: Document) {
     const params = new URLSearchParams(window.location.hash.substring(1));
@@ -57,6 +60,12 @@ class GreenDevFloaty {
     };
 
     this.#initFloatyMode(document);
+    if (Greendev.Prototypes.instance().isEnabled('beyondStylingAntigravity')) {
+      this.#socketClient =
+          new AiAssistance.GreenDevAgentAntigravityCliSocketClient.GreenDevAgentAntigravityCliSocketClient();
+    } else {
+      this.#socketClient = new AiAssistance.GreenDevAgentGeminiCliSocketClient.GreenDevAgentGeminiCliSocketClient();
+    }
   }
 
   #initFloatyMode(doc: Document): void {
@@ -269,12 +278,67 @@ class GreenDevFloaty {
     const query = this.#textField.value || this.#textField.placeholder;
     this.#textField.value = '';
 
-    const useGreenDevAgent = Greendev.Prototypes.instance().isEnabled('beyondStyling');
+    const useAntigravity = Greendev.Prototypes.instance().isEnabled('beyondStylingAntigravity');
+    const useGemini = Greendev.Prototypes.instance().isEnabled('beyondStylingGemini');
+    const useGreenDevAgent = useAntigravity || useGemini;
+    const isAntigravity = useAntigravity;
 
     if (!this.#agent) {
       const aidaClient = new AidaClient();
       if (useGreenDevAgent) {
+        if (isAntigravity) {
+          this.#socketClient =
+              new AiAssistance.GreenDevAgentAntigravityCliSocketClient.GreenDevAgentAntigravityCliSocketClient();
+        } else {
+          this.#socketClient = new AiAssistance.GreenDevAgentGeminiCliSocketClient.GreenDevAgentGeminiCliSocketClient();
+        }
+
         this.#agent = new AiAssistance.GreenDevAgent.GreenDevAgent({aidaClient});
+        this.#agent.addEventListener(
+            AiAssistance.GreenDevAgent.Events.CLI_PROMPT_REQUESTED,
+            async (
+                event: Common.EventTarget.EventTargetEvent<
+                    AiAssistance.GreenDevAgent.EventTypes[AiAssistance.GreenDevAgent.Events.CLI_PROMPT_REQUESTED]>) => {
+              const {prompt} = event.data;
+              const remoteName = isAntigravity ? 'Antigravity' : 'Gemini';
+              const aiContent =
+                  this.#addMessageInternal(`Fix has been submitted to ${remoteName} CLI, please wait...`, false);
+
+              if (isAntigravity) {
+                let fullResponse = '';
+                void (
+                    this.#socketClient as
+                    AiAssistance.GreenDevAgentAntigravityCliSocketClient.GreenDevAgentAntigravityCliSocketClient)
+                    .sendPrompt(prompt, (chunk: string) => {
+                      fullResponse += chunk;
+                      const responseText = `Antigravity CLI responds: ${fullResponse}`;
+                      const markdown = new MarkdownView.MarkdownView.MarkdownView();
+                      markdown.data = {
+                        tokens: Marked.Marked.lexer(responseText),
+                      };
+
+                      const style = document.createElement('style');
+                      style.textContent =
+                          '.message { font-size: 1.0rem; } .message code { font-size: 1.0rem; font-family: \'Roboto Mono\', ' +
+                          'monospace; color: green; } .message ul { margin-left: 20px; }';
+                      markdown.shadowRoot?.appendChild(style);
+
+                      this.#updateAiMessage(aiContent, markdown, responseText);
+                    });
+              } else {
+                const response =
+                    await (this.#socketClient as
+                           AiAssistance.GreenDevAgentGeminiCliSocketClient.GreenDevAgentGeminiCliSocketClient)
+                        .sendPrompt(prompt);
+
+                const responseText = `Gemini CLI responds: ${response}`;
+                const markdown = new MarkdownView.MarkdownView.MarkdownView();
+                markdown.data = {
+                  tokens: Marked.Marked.lexer(responseText),
+                };
+                this.#updateAiMessage(aiContent, markdown, responseText);
+              }
+            });
       } else {
         this.#agent = new AiAssistance.StylingAgent.StylingAgent({aidaClient});
         this.#nodeContext = new AiAssistance.StylingAgent.NodeContext(this.#node);
@@ -282,22 +346,7 @@ class GreenDevFloaty {
     }
 
     this.#addMessageInternal(query, true);
-    this.#syncChannel.postMessage({
-      type: 'new-message',
-      text: query,
-      isUser: true,
-      sessionId: this.#backendNodeId,
-      nodeDescription: document.querySelector('.green-dev-floaty-dialog-node-description')?.textContent,
-    });
-
     const aiContent = this.#addMessageInternal('Thinking...', false);
-    this.#syncChannel.postMessage({
-      type: 'new-message',
-      text: 'Thinking...',
-      isUser: false,
-      sessionId: this.#backendNodeId,
-      nodeDescription: document.querySelector('.green-dev-floaty-dialog-node-description')?.textContent,
-    });
 
     let agentFinished = false;
     let steps = 0;
@@ -433,7 +482,8 @@ ${axTree}`;
             markdown.data = {
               tokens: Marked.Marked.lexer(sanitizedText),
             };
-            aiContent.append(markdown);
+            this.#updateAiMessage(aiContent, markdown, result.text);
+
             void new Promise(resolve => setTimeout(resolve, 0)).then(() => {
               const style = document.createElement('style');
               style.textContent =
@@ -456,15 +506,12 @@ ${axTree}`;
                 }
               }
             });
-            this.#syncChannel.postMessage(
-                {type: 'update-last-message', text: result.text, sessionId: this.#backendNodeId});
             agentFinished = true;
             break;
           }
           case ResponseType.ERROR:
-            aiContent.textContent = this.#formatError(result.error);
-            this.#syncChannel.postMessage(
-                {type: 'update-last-message', text: this.#formatError(result.error), sessionId: this.#backendNodeId});
+            this.#updateAiMessage(
+                aiContent, document.createTextNode(this.#formatError(result.error)), this.#formatError(result.error));
             agentFinished = true;
             break;
           case ResponseType.SIDE_EFFECT:
@@ -503,8 +550,23 @@ ${axTree}`;
       this.#chatContainer.appendChild(messageElement);
       this.#chatContainer.scrollTop = this.#chatContainer.scrollHeight;
     }
+
+    this.#syncChannel.postMessage({
+      type: 'new-message',
+      text,
+      isUser,
+      sessionId: this.#backendNodeId,
+      nodeDescription: document.querySelector('.green-dev-floaty-dialog-node-description')?.textContent,
+    });
+
     return content;
   }
+
+  #updateAiMessage(aiContentElement: HTMLDivElement, newContent: Node, newText: string): void {
+    aiContentElement.textContent = '';
+    aiContentElement.append(newContent);
+    this.#syncChannel.postMessage({type: 'update-last-message', text: newText, sessionId: this.#backendNodeId});
+  }
 }
 
 let greenDevFloatyInstance: GreenDevFloaty;

package/front_end/models/ai_assistance/agents/AccessibilityAgent.ts

@@ -29,25 +29,6 @@ import {
   JavascriptExecutor
 } from './ExecuteJavascript.js';
 
-/**
- * The subset of computed CSS properties relevant to accessibility audits.
- * These are used to filter the Computed Styles widget in the AI Chat panel to keep it focused and minimal.
- */
-const ACCESSIBILITY_CSS_PROPERTIES = [
-  'color',
-  'background-color',
-  'display',
-  'visibility',
-  'opacity',
-  'clip',
-  'clip-path',
-  'font-size',
-  'font-weight',
-  'line-height',
-  'letter-spacing',
-  'text-transform',
-];
-
 /**
  * WARNING: preamble defined in code is only used when userTier is
  * TESTERS. Otherwise, a server-side preamble is used (see
@@ -486,20 +467,13 @@ export class AccessibilityAgent extends AiAgent<LHModel.ReporterTypes.ReportJSON
         };
 
         const widgets: AiWidget[] = [];
-        const cssModel = node.domModel().cssModel();
-        const styles = await cssModel.getComputedStyle(node.id);
-        const matchedStyles = await cssModel.getMatchedStyles(node.id);
-        if (styles && matchedStyles) {
-          widgets.push({
-            name: 'COMPUTED_STYLES',
-            data: {
-              computedStyles: styles,
-              backendNodeId: node.backendNodeId(),
-              matchedCascade: matchedStyles,
-              properties: ACCESSIBILITY_CSS_PROPERTIES,
-            },
-          });
-        }
+        const snapshot = await node.takeSnapshot();
+        widgets.push({
+          name: 'DOM_TREE',
+          data: {
+            root: snapshot,
+          },
+        });
 
         return {
           result: JSON.stringify(result, null, 2),

package/front_end/models/ai_assistance/agents/AiAgent.ts

@@ -330,10 +330,17 @@ export interface LighthouseReportAiWidget {
   };
 }
 
-// This type will grow as we add more widgets.
-export type AiWidget =
-    ComputedStyleAiWidget|CoreVitalsAiWidget|StylePropertiesAiWidget|DomTreeAiWidget|PerformanceTraceAiWidget|
-    PerfInsightAiWidget|TimelineRangeSummaryAiWidget|BottomUpTreeAiWidget|SourceFileAiWidget|LighthouseReportAiWidget;
+export interface TimelineEventSummaryAiWidget {
+  name: 'TIMELINE_EVENT_SUMMARY';
+  data: {
+    event: Trace.Types.Events.Event,
+    parsedTrace: Trace.TraceModel.ParsedTrace,
+  };
+}
+
+export type AiWidget = ComputedStyleAiWidget|CoreVitalsAiWidget|StylePropertiesAiWidget|DomTreeAiWidget|
+    PerformanceTraceAiWidget|PerfInsightAiWidget|TimelineRangeSummaryAiWidget|BottomUpTreeAiWidget|SourceFileAiWidget|
+    LighthouseReportAiWidget|TimelineEventSummaryAiWidget;
 
 export type FunctionCallHandlerResult<Result> = {
   requiresApproval: true,

package/front_end/models/ai_assistance/agents/GreenDevAgent.ts

@@ -2,6 +2,7 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
+import * as Common from '../../../core/common/common.js';
 import * as Host from '../../../core/host/host.js';
 import * as Root from '../../../core/root/root.js';
 import * as SDK from '../../../core/sdk/sdk.js';
@@ -53,9 +54,9 @@ additional context and resolve the user request.
     directly relevant to the user's problem. Do not get distracted by generic framework
     messages.
 
-6.  **Formulate a Hypothesis**: Based on your code investigation, explain the likely root
-    cause to the user and suggest a concrete fix or next step. If you suspect an issue in a
-    JavaScript function, point it out.
+6.  **Formulate a Hypothesis**: Based on your code investigation, and if you have a promising
+    fix, ALWAYS apply it using the provided 'applyFix' function. If you can identify more than
+    one fix, ask the user which one to apply.
 
 ### Available Information
 
@@ -82,6 +83,7 @@ To help you further, you can call the following functions:
   request list.
 - 'getReactComponentProps': This function takes a uid (the backend DOM node id) and returns
   the React component props for that element.
+- 'applyFix': This function accepts a code diff to apply to the code base.
 
 Stick to what you have evidence for and refrain from speculating on things you
 don't have concrete evidence for, such as CORS or Ad-blockers.
@@ -112,11 +114,38 @@ export class GreenDevContext extends ConversationContext<string> {
   }
 }
 
+export const enum Events {
+  CLI_PROMPT_REQUESTED = 'CliPromptRequested',
+}
+
+export interface EventTypes {
+  [Events.CLI_PROMPT_REQUESTED]: {prompt: string};
+}
+
+export const enum RemoteEndpoint {
+  GEMINI_CLI_SOCKET = 'GeminiCliSocket',
+  ANTIGRAVITY_CLI_SOCKET = 'AntigravityCliSocket',
+}
+
 /**
  * This agent is a general-purpose web page troubleshooting agent for GreenDev
  * prototypes.
  */
 export class GreenDevAgent extends AiAgent<string> {
+  #eventTarget = new Common.ObjectWrapper.ObjectWrapper<EventTypes>();
+
+  addEventListener<T extends keyof EventTypes>(
+      eventType: T, listener: (arg0: Common.EventTarget.EventTargetEvent<EventTypes[T]>) => void,
+      thisObject?: Object): Common.EventTarget.EventDescriptor<EventTypes, T> {
+    return this.#eventTarget.addEventListener(eventType, listener, thisObject);
+  }
+
+  removeEventListener<T extends keyof EventTypes>(
+      eventType: T, listener: (arg0: Common.EventTarget.EventTargetEvent<EventTypes[T]>) => void,
+      thisObject?: Object): void {
+    this.#eventTarget.removeEventListener(eventType, listener, thisObject);
+  }
+
   constructor(options: AgentOptions) {
     super(options);
 
@@ -327,6 +356,38 @@ export class GreenDevAgent extends AiAgent<string> {
         };
       },
     });
+
+    this.declareFunction<{
+      codeSuggestionDiff: string,
+    }>('applyFix', {
+      description: 'Apply a code fix for the user to review.',
+      parameters: {
+        type: Host.AidaClient.ParametersTypes.OBJECT,
+        description: '',
+        nullable: false,
+        properties: {
+          codeSuggestionDiff: {
+            type: Host.AidaClient.ParametersTypes.STRING,
+            description: 'The diff of the suggested code change.',
+            nullable: false,
+          },
+        },
+        required: ['codeSuggestionDiff'],
+      },
+      handler: async (params: {codeSuggestionDiff: string}) => {
+        const result = await this.applyFix(params.codeSuggestionDiff);
+        return {
+          result,
+        };
+      },
+    });
+  }
+
+  async applyFix(codeSuggestionDiff: string): Promise<string> {
+    console.warn('[GreenDevAgent] applyFix called with:', codeSuggestionDiff);
+    this.#eventTarget.dispatchEventToListeners(
+        Events.CLI_PROMPT_REQUESTED, {prompt: `Apply this diff:\n${codeSuggestionDiff}`});
+    return 'The fix suggestion has been submitted.';
   }
 
   override preamble = preamble;
@@ -377,8 +438,10 @@ export class GreenDevAgent extends AiAgent<string> {
   }
 
   static isEnabled(): boolean {
-    console.warn('BeyondStyling prototype is enabled:', Greendev.Prototypes.instance().isEnabled('beyondStyling'));
-    return Greendev.Prototypes.instance().isEnabled('beyondStyling');
+    const isGeminiEnabled = Greendev.Prototypes.instance().isEnabled('beyondStylingGemini');
+    const isAntigravityEnabled = Greendev.Prototypes.instance().isEnabled('beyondStylingAntigravity');
+    console.warn('BeyondStyling prototype is enabled:', isGeminiEnabled || isAntigravityEnabled);
+    return isGeminiEnabled || isAntigravityEnabled;
   }
 
   static formatConsoleMessage(message: SDK.ConsoleModel.ConsoleMessage, index: number): string {

package/front_end/models/ai_assistance/agents/GreenDevAgentAntigravityCliSocketClient.ts

@@ -0,0 +1,53 @@
+// Copyright 2026 The Chromium Authors
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+export class GreenDevAgentAntigravityCliSocketClient {
+  #websocket: WebSocket;
+  sessionReady: Promise<void>;
+  #sessionReadyResolve: ((value: void|PromiseLike<void>) => void)|null = null;
+
+  constructor() {
+    this.sessionReady = new Promise(resolve => {
+      this.#sessionReadyResolve = resolve;
+    });
+    this.#websocket = new WebSocket('ws://localhost:5566');
+    this.#websocket.onopen = this.#onOpen.bind(this);
+    this.#websocket.onmessage = this.#onMessage.bind(this);
+    this.#websocket.onclose = this.#onClose.bind(this);
+    this.#websocket.onerror = this.#onError.bind(this);
+  }
+
+  #onOpen(): void {
+    console.warn('WebSocket connected (Antigravity).');
+    if (this.#sessionReadyResolve) {
+      this.#sessionReadyResolve();
+      this.#sessionReadyResolve = null;
+    }
+  }
+
+  #onMessage(event: MessageEvent): void {
+    console.warn('Antigravity WebSocket message received:', event.data);
+    if (this.#onChunkCallback) {
+      this.#onChunkCallback(event.data);
+    }
+  }
+
+  #onClose(): void {
+    console.warn('WebSocket disconnected (Antigravity).');
+  }
+
+  #onError(error: Event): void {
+    console.error('WebSocket error (Antigravity):', error);
+  }
+
+  #onChunkCallback: ((chunk: string) => void)|null = null;
+
+  sendPrompt(promptText: string, onChunk: (chunk: string) => void): Promise<void> {
+    this.#onChunkCallback = onChunk;
+
+    console.warn(`Sending Antigravity prompt: "${promptText}"`);
+    this.#websocket.send(promptText);
+    return Promise.resolve();
+  }
+}

package/front_end/models/ai_assistance/agents/GreenDevAgentGeminiCliSocketClient.ts

@@ -0,0 +1,117 @@
+// Copyright 2026 The Chromium Authors
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+export class GreenDevAgentGeminiCliSocketClient {
+  #websocket: WebSocket;
+  #sessionId?: string;
+  #activeMessage = '';
+  #messageLog: string[] = [];
+  #promptResolve: ((response: string) => void)|null = null;
+  sessionReady: Promise<void>;
+  #sessionReadyResolve: ((value: void|PromiseLike<void>) => void)|null = null;
+
+  constructor() {
+    this.sessionReady = new Promise(resolve => {
+      this.#sessionReadyResolve = resolve;
+    });
+    this.#websocket = new WebSocket('ws://localhost:6655');
+    this.#websocket.onopen = this.#onOpen.bind(this);
+    this.#websocket.onmessage = this.#onMessage.bind(this);
+    this.#websocket.onclose = this.#onClose.bind(this);
+    this.#websocket.onerror = this.#onError.bind(this);
+  }
+
+  #onOpen(): void {
+    console.warn('WebSocket connected.');
+    this.#websocket.send(
+        JSON.stringify({jsonrpc: '2.0', method: 'session/new', params: {cwd: '.', mcpServers: []}, id: 14}));
+  }
+
+  #onMessage(event: MessageEvent): void {
+    this.#messageLog.push(event.data);
+
+    try {
+      const data = JSON.parse(event.data);
+
+      if (data?.result?.sessionId && !this.#sessionId) {
+        this.#sessionId = data.result.sessionId;
+        console.warn(`Successfully created new session with ID: ${this.#sessionId}`);
+        if (this.#sessionReadyResolve) {
+          this.#sessionReadyResolve();
+          this.#sessionReadyResolve = null;
+        }
+      }
+
+      const update = data?.params?.update;
+      if (update?.sessionUpdate === 'agent_message_chunk') {
+        this.#activeMessage += update.content?.text || '';
+      }
+
+      if (data?.result?.stopReason) {
+        if (this.#activeMessage) {
+          console.warn(this.#activeMessage);
+        }
+        console.warn(`Stop Reason: ${data.result.stopReason}`, this.#messageLog);
+
+        if (this.#promptResolve) {
+          this.#promptResolve(this.#activeMessage);
+          this.#promptResolve = null;
+        }
+
+        this.#activeMessage = '';
+        this.#messageLog = [];
+      } else if (data?.method === 'session/request_permission') {
+        // TODO(finnur): Needs augmenting once I turn off YOLO in the bridge.
+        this.#websocket.send(JSON.stringify({
+          jsonrpc: '2.0',
+          id: data.id,
+          result: {
+            outcome: {
+              selected: {
+                optionId: 'proceed_always',
+              },
+            },
+          },
+        }));
+      }
+    } catch (e) {
+      // Log the raw data if it's not valid JSON.
+      console.error('Failed to parse WebSocket message or process data:', event.data, e);
+    }
+  }
+
+  #onClose(): void {
+    console.warn('WebSocket disconnected.');
+  }
+
+  #onError(error: Event): void {
+    console.error('WebSocket error:', error);
+  }
+
+  sendPrompt(promptText: string): Promise<string> {
+    return new Promise((resolve, reject) => {
+      if (this.#promptResolve) {
+        reject(new Error('Another prompt is already in progress.'));
+        return;
+      }
+      if (!this.#sessionId) {
+        reject(new Error('Cannot send prompt without a session ID.'));
+        return;
+      }
+      this.#promptResolve = resolve;
+
+      console.warn(`Sending prompt: "${promptText}"`);
+      console.warn('Thinking...');
+      this.#websocket.send(JSON.stringify({
+        jsonrpc: '2.0',
+        method: 'session/prompt',
+        params: {
+          prompt: [{type: 'text', text: promptText}],
+          sessionId: this.#sessionId,
+        },
+        id: 15,
+      }));
+    });
+  }
+}