claude-plugins/dev-tools/skills/chrome/SKILL.md

name, description, author, version, quality_score, user_invocable, allowed-tools

name	description	author	version	quality_score	user_invocable	allowed-tools
chrome	Chrome browser integration for Claude Code. Navigate pages, fill forms, debug console, extract data, test web apps, automate tasks. Use when user mentions "chrome", "browser", "navegar site", "abrir pagina", "testar site", "preencher formulario", "extrair dados", "screenshot site", "google docs", "authenticated site", "gravar gif", "console errors".	Descomplicar® Crescimento Digital	1.0.0	80	true	Bash, Read, Write, Glob

/chrome - Chrome Browser Integration

Integra Claude Code com o Chrome para automacao browser, testes, debug e extraccao de dados.

Pre-Requisitos

Requisito	Minimo	Verificar
Google Chrome	Instalado	google-chrome --version
Extensao Claude in Chrome	v1.0.36+	chrome://extensions
Claude Code	v2.0.73+	claude --version
Plano Claude	Pro/Max/Team/Enterprise	-
Native Host	Configurado	~/.config/google-chrome/NativeMessagingHosts/com.anthropic.claude_code_browser_extension.json

Limitacoes: Apenas Google Chrome (nao Brave/Arc). Nao suportado em WSL.

Activacao

Por sessao

claude --chrome

Por defeito (aliases .bashrc)

alias cc="claude --permission-mode bypassPermissions --chrome"

Dentro de sessao activa

/chrome
# Seleccionar "Enabled by default"

Ver ferramentas disponiveis

/mcp -> seleccionar claude-in-chrome

Capacidades

1. Navegacao e Interaccao

• Abrir URLs em novas tabs
• Clicar botoes, links, elementos
• Preencher formularios (input, select, textarea)
• Submeter forms
• Scroll e hover

2. Debug e Diagnostico

• Ler console logs, errors, warnings
• Inspeccionar DOM state
• Verificar network requests
• Ler JavaScript errors em tempo real

3. Extraccao de Dados

• Extrair texto estruturado de paginas
• Scraping de tabelas, listas, precos
• Guardar dados como CSV/JSON local
• Ler conteudo de paginas autenticadas

4. Testes Web

• Testar forms com dados invalidos
• Verificar UI contra mocks
• Validar user flows completos
• Testar responsividade

5. Sites Autenticados

• Google Docs, Gmail, Sheets
• Notion, Slack web
• CRMs, dashboards
• Qualquer site com sessao activa no Chrome

6. Automacao

• Data entry repetitivo
• Multi-site workflows
• Gravar demos como GIF
• Preencher CRMs a partir de CSV

Workflows Comuns

Testar aplicacao local

Abre localhost:3000, tenta submeter o formulario com dados invalidos
e verifica se as mensagens de erro aparecem correctamente.

Debug com console

Abre a pagina do dashboard e verifica o console por erros
quando a pagina carrega.

Preencher formularios em massa

Tenho um ficheiro contacts.csv. Para cada linha, vai ao CRM em
crm.example.com, clica "Adicionar Contacto" e preenche nome, email e telefone.

Escrever em Google Docs

Escreve um resumo do projecto baseado nos commits recentes
no Google Doc docs.google.com/document/d/abc123

Extrair dados de paginas

Vai a pagina de produtos e extrai nome, preco e disponibilidade
de cada item. Guarda como CSV.

Workflow multi-site

Verifica o meu calendario para reunioes amanha, depois para cada
reuniao com participante externo, pesquisa o site da empresa.

Gravar demo GIF

Grava um GIF mostrando o fluxo de checkout, desde adicionar item
ao carrinho ate a pagina de confirmacao.

Chrome vs Puppeteer vs WebFetch

Feature	Chrome (--chrome)	Puppeteer MCP	WebFetch
Sessoes autenticadas	Sim	Nao	Nao
Janela visivel	Sim	Opcional	N/A
Sites privados	Sim (se logado)	Nao	Nao
Headless	Nao	Sim	Sim
Interaccao UI	Completa	Completa	Nao
Screenshots	Sim	Sim	Nao
Gravar GIF	Sim	Nao	Nao
Console logs	Sim	Sim	Nao
Sem Chrome	N/A	Funciona	Funciona
Context usage	Alto (tools loaded)	Medio	Baixo

Regra de decisao:

• Precisa de login/sessao? -> Chrome
• Automacao headless? -> Puppeteer MCP
• Apenas ler conteudo publico? -> WebFetch

Troubleshooting

Extensao nao detectada

1. Verificar extensao em chrome://extensions
2. Verificar versao Claude Code: claude --version (>= 2.0.73)
3. Confirmar Chrome aberto
4. /chrome -> "Reconnect extension"
5. Reiniciar Chrome E Claude Code

Browser nao responde

1. Verificar se modal dialog esta a bloquear (alert/confirm/prompt)
2. Dispensar dialog manualmente, depois continuar
3. Pedir nova tab
4. Desactivar/reactivar extensao em chrome://extensions

Conexao cai em sessoes longas

• Service worker do Chrome pode ficar idle
• Solucao: /chrome -> "Reconnect extension"

Erros comuns

Erro	Causa	Solucao
"Browser extension is not connected"	Native host nao alcanca extensao	Reiniciar Chrome + Claude, /chrome reconnect
"Extension not detected"	Extensao nao instalada/desactivada	Instalar/activar em chrome://extensions
"No tab available"	Accao antes de tab pronta	Pedir nova tab e retry
"Receiving end does not exist"	Service worker idle	/chrome -> "Reconnect extension"

Verificar instalacao

# Chrome instalado?
google-chrome --version

# Native host configurado?
cat ~/.config/google-chrome/NativeMessagingHosts/com.anthropic.claude_code_browser_extension.json

# Claude Code compativel?
claude --version

# Host script existe?
ls -la ~/.claude/chrome/chrome-native-host

Permissoes de Sites

Permissoes por site sao geridas na extensao Chrome (nao no Claude Code):

• Abrir extensao Claude in Chrome -> Settings
• Configurar quais sites podem ser acedidos
• Bloqueios aplicam-se a todas as sessoes

Nota de Performance

Activar Chrome por defeito aumenta consumo de context window porque as ferramentas browser ficam sempre carregadas. Se notar degradacao:

1. Desactivar default: /chrome -> desactivar
2. Usar claude --chrome apenas quando necessario
3. Preferir WebFetch para leituras simples de paginas publicas