Como Usar o OpenClaw para Automação de Navegador

O Que Você Vai Construir

Uma configuração de automação de navegador que permite ao OpenClaw:

1. Navegar em sites — abrir páginas, clicar em botões, preencher formulários, rolar pelo conteúdo
2. Extrair dados — fazer scraping de dados estruturados de páginas web, tabelas e dashboards
3. Capturar screenshots — tirar screenshots de página inteira ou de elementos específicos para relatórios
4. Executar fluxos multi-etapas — encadear ações no navegador em sequências complexas de automação

Ao final deste guia, você vai conseguir automatizar qualquer tarefa no navegador descrevendo o que deseja em linguagem natural.

Por Que Usar IA para Automação de Navegador

Ferramentas tradicionais de automação de navegador (Selenium, Puppeteer, Playwright) são poderosas, mas exigem escrever e manter código para cada fluxo de trabalho. Quando o site muda o layout, seus scripts quebram. Quando você precisa de um novo fluxo, escreve um novo script.

A automação de navegador com IA muda isso:

• Instruções em linguagem natural — descreva o que você quer em vez de escrever seletores e handlers de clique
• Auto-correção — a IA se adapta a mudanças na interface sem atualizar scripts
• Sem manutenção de código — os fluxos são definidos por intenção, não por implementação
• Prototipagem rápida — configure uma nova automação em minutos, não em horas
• Compreensão visual — a IA consegue interpretar o layout da página, ler texto de screenshots e tomar decisões com base no que vê

Pré-requisitos

• OpenClaw instalado e configurado (Guia de Introdução)
• Chrome ou Chromium instalado no seu sistema
• Node.js 18+

Passo 1: Instalar os Skills Necessários

# 1. Controle do navegador
npx clawhub@latest install browser-use

# 2. Extração de dados web
npx clawhub@latest install web-scraper

# 3. Captura de screenshots
npx clawhub@latest install screenshot

Passo 2: Verificar a Configuração do Navegador

O skill browser-use precisa de uma instalação do Chrome/Chromium:

clawhub inspect browser-use

Isso verifica se há um navegador compatível e exibe o caminho detectado. Se o Chrome não for encontrado automaticamente, defina o caminho manualmente na configuração do skill.

Passo 3: Automação de Navegador em Ação

Exemplo 1: Extrair Dados de um Dashboard

Suponha que você precise puxar métricas de um dashboard web toda manhã:

Abra https://analytics.example.com, faça login com minhas credenciais salvas,
navegue até a página de Métricas Diárias e extraia a tabela mostrando
os KPIs de ontem em formato de tabela Markdown.

O skill de navegador cuida do login, navegação e extração de dados. O resultado é uma tabela Markdown limpa que você pode colar em relatórios ou no Slack.

Exemplo 2: Monitorar Página de Preços de um Concorrente

Acesse competitor.com/pricing, tire um screenshot da tabela de preços
e extraia todos os nomes de planos, preços e listas de funcionalidades em formato JSON.

Saída:

{
  "plans": [
    {
      "name": "Starter",
      "price": "$29/month",
      "features": ["5 users", "10GB storage", "Email support"]
    },
    {
      "name": "Professional",
      "price": "$79/month",
      "features": ["25 users", "100GB storage", "Priority support", "API access"]
    },
    {
      "name": "Enterprise",
      "price": "Custom",
      "features": ["Unlimited users", "Unlimited storage", "24/7 support", "SSO", "Audit logs"]
    }
  ]
}

Exemplo 3: Preencher um Formulário

Abra o formulário interno de relatório de despesas em expenses.company.com,
preencha: data = hoje, categoria = "Software", valor = $49.99,
descrição = "Assinatura ClawHub Pro", e envie.

Exemplo 4: Fluxo de Pesquisa Multi-Etapas

1. Pesquise no Google "best CI/CD tools 2026 comparison"
2. Abra os 3 primeiros resultados
3. Extraia os principais pontos de comparação de cada artigo
4. Compile em uma tabela resumo

Passo 4: Screenshots para Relatórios

O skill de screenshot captura evidências visuais para relatórios e monitoramento:

# Screenshot de página inteira
clawhub run screenshot --url "https://status.example.com" --full-page

# Elemento específico
clawhub run screenshot --url "https://grafana.example.com/d/api-latency" --selector ".panel-container"

# Múltiplas páginas
clawhub run screenshot --urls "url1,url2,url3" --output "./screenshots/"

Monitoramento Visual Agendado

Combine com cron para capturar snapshots diários:

clawhub run cron --schedule "0 9 * * *" --task "screenshot --url https://status.example.com --output ~/snapshots/{{date}}.png"

Avançado: Fluxos de Trabalho Complexos

Encadeando Ações do Navegador

Para fluxos multi-etapas que precisam rodar de forma confiável:

# .openclaw/browser-workflow.yml
workflow:
  name: "Daily Metrics Collection"
  steps:
    - action: navigate
      url: "https://analytics.example.com"
    - action: login
      credentials: "analytics_dashboard"
    - action: click
      target: "Daily Report tab"
    - action: wait
      condition: "table is fully loaded"
    - action: extract
      target: "metrics table"
      format: "csv"
    - action: screenshot
      target: "full page"
    - action: save
      output: "~/reports/{{date}}-metrics.csv"

Lidando com Autenticação

Para sites que exigem login:

credentials:
  analytics_dashboard:
    url: "https://analytics.example.com/login"
    username_field: "#email"
    password_field: "#password"
    # Credenciais armazenadas no credential store seguro do OpenClaw

Use clawhub credentials set analytics_dashboard para armazenar dados de login de forma segura.

Trabalhando com SPAs e Conteúdo Dinâmico

Aplicações single-page modernas carregam conteúdo dinamicamente. O skill de navegador lida com isso automaticamente:

• Aguardando a conclusão de requisições de rede
• Detectando quando a página está totalmente renderizada
• Tentando novamente se o conteúdo ainda não carregou

Para páginas particularmente lentas, você pode definir condições explícitas de espera:

Navegue até o dashboard e aguarde até que o gráfico rotulado "Revenue" esteja visível antes de tirar o screenshot.

Solução de Problemas

O navegador não abre

• Verifique se o Chrome/Chromium está instalado: which google-chrome ou which chromium
• Confira o caminho na configuração do skill: clawhub inspect browser-use
• Em servidores headless, verifique se a flag --no-sandbox está habilitada na configuração

O conteúdo da página não carrega

• Algumas páginas exigem JavaScript — o skill de navegador roda um navegador completo, então isso deve funcionar por padrão
• Verifique se há banners de consentimento de cookies bloqueando o conteúdo
• Confirme que a URL é acessível da sua máquina (VPN, firewall)

Screenshots estão em branco ou incompletos

• Adicione um tempo de espera antes da captura: a página pode ainda estar renderizando
• Use a flag --full-page para páginas que exigem rolagem
• Verifique se a página requer autenticação

A extração retorna dados errados

• Seja mais específico sobre qual elemento extrair
• Use referências visuais: "a tabela na segunda seção" ou "o card de preços à direita"
• Para páginas complexas, tire um screenshot primeiro para verificar o estado da página, depois extraia