1

Pitch: OpenCode Browser: extensão open source que conecta o Chrome ao seu agente OpenCode

Olá, pessoal do TabNews!

Estou desenvolvendo o OpenCode Browser, uma extensão de navegador open source (licença MIT) que conecta o Chrome ao OpenCode, um agente de código open source que roda no terminal, instalado na sua máquina. Ela tem duas caras: um chat no painel lateral (side panel) e um conjunto de ferramentas browser_* que o agente pode usar para navegar, ler e interagir com páginas.

A ideia nasceu de uma limitação prática: o agente escreve e revisa código, mas não consegue ver o resultado na tela. Com a extensão, ele abre uma aba, lê a página, clica, preenche formulários e confere o console — com você aprovando as ações.

Aviso desde já: o projeto está em desenvolvimento ativo. A instalação ainda é manual (build local e carregar sem compactação), a API pode mudar e algumas coisas vão quebrar. É justamente por isso que estou publicando: quero feedback e ajuda para amadurecer.

O que dá para fazer

  • Conversar com o modelo que você já usa no OpenCode direto no painel lateral do navegador.
  • Pedir coisas como "abra o Hacker News e resuma as 5 principais notícias" e acompanhar o agente executando, com cards de progresso.
  • Usar as 18 ferramentas browser_*: ler a página (árvore de acessibilidade com refs), buscar elementos, extrair texto, clicar e digitar, preencher formulários, executar JavaScript, tirar screenshot, ler console e requisições de rede, criar/anexar/fechar abas, redimensionar janela, fazer upload de arquivo, rodar um lote de até 20 ações e até gerar um GIF da sessão.
  • Manter o agente isolado em um grupo de abas da sessão — ele não sai mexendo nas suas abas.
  • Aprovar permissões: leitura roda direto; ações pedem confirmação (uma vez / nesta sessão / sempre / negar), com lista de domínios bloqueados e um card de plano quando o agente vai visitar domínios novos.

Dois modos de uso

1. Direto no navegador: o painel lateral tem chat, seletor de modelo e o histórico das conversas criadas por ele. É o jeito mais confortável para explorar.

2. Pela CLI: o plugin browser-relay registra as ferramentas browser_* no seu OpenCode. Ou seja, em qualquer sessão normal no terminal, o agente pode usar o navegador — basta a extensão estar conectada. Isso abre espaço para coisas como depurar uma página enquanto você olha o código ou acompanhar uma automação passo a passo.

Nos dois casos, a extensão fala apenas com o servidor local do OpenCode (127.0.0.1) e o plugin escuta somente em loopback. O modelo é o que você já tem configurado no OpenCode.

Como testar

Pré-requisitos: Node.js 20+, Chrome/Chromium 116+ e OpenCode v2.

git clone https://github.com/marcos2872/opencode-browser-extension
cd opencode-browser-extension
npm install
npm run build
npm run install:plugin

Depois:

  1. Abra chrome://extensions, ative o modo desenvolvedor e clique em "Carregar sem compactação", apontando para a pasta dist/.
  2. Rode opencode pair no terminal, copie o link e cole no onboarding do painel lateral.
  3. Escolha um modelo, crie uma conversa e peça algo.

A documentação cobre arquitetura, as ferramentas, o protocolo do plugin e o modelo de segurança na pasta docs/.

Status e limitações

  • Em desenvolvimento ativo, sem release estável. A instalação é manual e ainda não está na Chrome Web Store.
  • Foco em Chrome/Chromium (testado em Chromium e Brave). Firefox não é suportado no momento.
  • Mudanças podem quebrar a compatibilidade entre extensão e plugin; mantenha os dois atualizados.
  • Segurança é um tema em aberto: automação de navegador é poderosa. O modo "permitir automaticamente" deve ser evitado em sites sensíveis.

Open source, issues e PRs

O código está sob MIT em: https://github.com/marcos2872/opencode-browser-extension

Issues e PRs são muito bem-vindos. Especialmente:

  • relatos de bugs com passos para reproduzir (navegador, versão do OpenCode e o que o agente tentava fazer);
  • problemas de instalação ou pareamento em Linux, macOS e Windows;
  • melhorias de documentação e testes;
  • ideias de ferramentas ou de UX para as permissões.

Se você testar e algo não funcionar, abre uma issue mesmo que pareça pequeno — nessa fase, todo relato ajuda a priorizar.

E se o projeto fizer sentido para você, uma estrela no repo ajuda a divulgar.

Obrigado!

Carregando publicação patrocinada...
1

Dois pontos que eu olharia no modelo de segurança.

O primeiro é o loopback. Escutar só em 127.0.0.1 não impede que uma página qualquer aberta no mesmo navegador tente falar com localhost. O Chrome vem fechando isso aos poucos, mas eu não contaria com isso. Vale conferir se o plugin valida o header Origin e exige o token do pareamento em toda chamada, inclusive no WebSocket, que não passa por CORS.

O segundo é injeção de prompt pela própria página. O agente lê o texto do site, e esse texto pode trazer instrução escondida. Eu deixaria executar JavaScript e upload de arquivo pedindo confirmação sempre, mesmo quando o domínio estiver como "sempre permitir".