OpenCode in Chrome

Deja que tu agente local opencode vea y controle el navegador: pestañas, clics, JS, capturas de pantalla.

Anton Petnitsky · github.com/Mukller · LinkedIn

Alternativa a Claude-in-Chrome para opencode: extensión de Chrome + puente local con interfaz MCP. El agente obtiene control total sobre tu navegador en vivo — con sesiones iniciadas, sin --remote-debugging-port y sin nubes. Todo a través de localhost.

┌──────────────────┐   WebSocket    ┌─────────────────┐    stdio/MCP    ┌──────────┐
│ Chrome extension │◄──────────────►│  bridge (Node)  │◄───────────────►│ opencode │
│  chrome.debugger │  127.0.0.1     │  ws + mcp       │                 │          │
└──────────────────┘                └─────────────────┘                 └──────────┘

El truco clave: la extensión levanta la sesión CDP por sí misma a través de chrome.debugger — por lo que no se necesitan banderas de inicio del navegador, y todos los perfiles y cookies funcionan como siempre.

Funcionalidades

Related MCP server: chrome-devtools-mcp

Instalación

1. Puente

git clone https://github.com/Mukller/opencode-chrome.git
cd opencode-chrome
npm install
node bridge/bridge.mjs

En el primer inicio, el puente imprimirá el token y lo guardará en ~/.opencode-chrome/token.

2. Extensión

1. Abre chrome://extensions → activa Modo desarrollador

2. Cargar extensión sin empaquetar → selecciona la carpeta extension/

3. Haz clic en el icono de la extensión → Settings → pega el token del paso 1 → Save & reconnect

4. La insignia del icono debe volverse verde ON

3. Conectar a opencode

En ~/.config/opencode/opencode.json (o en el del proyecto):

{
  "mcp": {
    "chrome": {
      "type": "local",
      "command": ["node", "<путь до репо>/bridge/bridge.mjs"],
      "enabled": true
    }
  }
}

Reinicia opencode: las herramientas chrome_* aparecerán en el agente.

Variables de entorno del puente: OPENCODE_CHROME_PORT (por defecto 8766), OPENCODE_CHROME_TOKEN (token fijo en lugar de archivo).

Seguridad

• El servidor WS escucha solo en 127.0.0.1, las conexiones externas se rechazan.

• El handshake requiere token; token incorrecto = la conexión se cierra.

• La extensión ejecuta comandos solo del puente conectado; todo se ve en la placa amarilla «depuración iniciada» durante operaciones activas.

Limitaciones conocidas

• Mientras la sesión CDP está activa en la pestaña, Chrome muestra la barra de información «La extensión comenzó a depurar este navegador»: es el precio por el acceso sin banderas de devtools.

• El service worker de la extensión se duerme cuando Chrome está inactivo; el puente simplemente espera la reconexión (auto-reconnect).

Pruebas

npm test        # E2E: фейковое расширение + MCP-клиент против реального моста

Licencia

MIT © Anton Petnitsky