Demonstraste uma vez. Por que ainda o estás a fazer?
Skill Recorder é uma extensão Chrome que te observa a percorrer uma tarefa de navegador uma vez — e depois escreve um SKILL.md, uma especificação em markdown puro que o Claude Code (ou qualquer agente sobre a CLI browse) reproduz sem seletores, sem glue code e sem supervisão.
↑ um fluxo de ordem de compra de cinco minutos, gravado uma vez e reproduzido para sempre.
Anatomia
Três etapas, a um clique de distância.
O que entregamos é uma pequena extensão Chrome MV3 e um pipeline de destilação de 4 KB. O gravador liga-se ao chrome.debugger para fidelidade ao nível do DOM; a destilação corre toda no service worker; a reprodução lê o SKILL.md resultante via CLI browse. Sem servidor. Sem glue code.
i.
Capturar
Painel lateral
Skill RecorderREC
00:01click nav.Orders
00:02click btn.New
00:04focus #sku
00:05type "SKU-1029"
00:06blur #sku
00:08type "50" → #qty
00:09click btn.Submit
Uma porta por frame no content script reencaminha cada evento DOM ao service worker. Shadow DOM e iframes da mesma origem são atravessados de forma transparente.
Resolutor de seletores em 6 níveis (testid → id → aria → text → css → xpath)
tabPorts: Map<tabId, Map<frameId, Port>>
Buffer de input consciente do IME · paste · drag
23 eventos →
ii.
Destilar
Service worker · 30 s
✓dedupe consecutive clicks23 → 16
✓fold keystrokes into type()16 → 11
✓detect inputs as {{params}}conf 0.94
✓mark auth boundary+1 precondition
✓parameterize URL segments2 swapped
✓flag dynamic-list clicks1 ⚠ note
Seis pequenas passagens transformam um log ruidoso de eventos numa especificação determinística. A auto-parametrização só dispara acima de 0,7 de confiança; abaixo, o gravador pergunta em vez de adivinhar.
paramConfidence(step) — escada heurística
deteção de auth-boundary — token opaco + cookies
UUID · ID numérico · email · data ISO · moeda
SKILL.md →
iii.
Reproduzir
browse CLI
~/work $ claude
> create POs for these 50 rows
Reading ~/.claude/skills/create-purchase-order/SKILL.md
Loaded 4 steps · 2 params · 1 precondition
▸ resolving precondition: signed in to supplier portal
✓ cookie present, expires 2026-08-04
▸ running batch [50 rows]
✓ 50/50 in 3m 11s
✓ 0 retries, 0 manual rescues
A CLI browse lê SKILL.md como markdown puro — sem esquema, sem runtime, sem saídas de emergência. Cada passo é auditável.
reexecuções idempotentes · pausa + retoma de auth
logs estruturados ↦ histórico JSONL
funciona com Claude Code, Cline, shell simples
Especificação
O que sobrevive a uma gravação? Treze casos difíceis, ponta a ponta.
O navegador está cheio de armadilhas para gravadores — classes com hash, modais preguiçosas, Shadow DOM, fluxos entre separadores, composição IME, drag-and-drop. Cada linha abaixo é uma fixture real no playground; clica em qualquer uma para gravares contra ela tu próprio.
Treze em dezasseis. Mais quatro fixtures compostas — Notion, Linear, Jira, Salesforce — que encadeiam doze a quinze destas técnicas num único fluxo coerente. Vê o playground →
Exemplo trabalhado
Um ritual de navegador de cinco minutos, destilado em trinta segundos.
Caderno de campoGravado 2026-02-19, 16:42 UTCReproduzido 50× sem intervenção
Toda segunda-feira de manhã uma engenheira de operações de um pequeno fornecedor abre o mesmo portal, clica em Nova ordem de compra, cola um SKU de um CSV, escreve uma quantidade e clica em Submeter. Depois faz outra vez. E outra. Duzentas linhas por semana, semana após semana, há catorze meses. É um ritual de cinco minutos repetido até a folha de cálculo acabar.
É exatamente o tipo de tarefa para a qual um gravador é vendido — e exatamente o tipo na qual a maioria dos gravadores tropeça. O portal do fornecedor roda hashes de classe Tailwind a cada deploy. O botão Submeter vive dentro de uma linha de tabela dinâmica que re-renderiza após cada gravação. O cookie de auth expira ao meio-dia. Scripts Selenium contra esta página sobrevivem duas semanas em média, depois começam a falhar em silêncio.
A gravação
A engenheira fixa a extensão à barra de ferramentas, abre o portal, clica em Iniciar gravação e executa a tarefa exatamente uma vez. Oito cliques, dois valores escritos, uma submissão. O painel lateral mostra um feed em direto dos eventos — incluindo ruído: scroll, focus, blur, mousemoves acidentais sobre o ícone de ajuda. Vinte e três eventos capturados em 4,6 segundos.
O log bruto guarda tudo; a destilação decide o que importa.
A destilação
main.example.p4
before / after23 eventos → 4 passos
— BEFORE (raw)
type"S" → #sku
type"K" → #sku
type"U" → #sku
type"-" → #sku
type"1" → #sku
type"0" → #sku
type"2" → #sku
type"9" → #sku
+ AFTER (distilled)
fill"#sku" with {{sku}}
+ AUTO-DETECTED
// 8 chars · alphanumeric · prefix SKU-
// confidence 0.94
Oito teclas tornam-se um fill parametrizado — mesma forma em cada reprodução.
A passagem de bastão
A engenheira coloca o markdown resultante em ~/.claude/skills/create-purchase-order/SKILL.md e escreve uma única frase ao Claude Code. O agente encontra o skill pelo nome, resolve a precondição (o cookie guardado é válido até ao meio-dia), itera sobre as cinquenta linhas do CSV e reporta. Três minutos e onze segundos depois, o trabalho está feito. Ninguém o viu correr.
claude code · stdout3 m 11 s · 0 retentativas
> create purchase orders for the rows in ~/Desktop/feb-orders.csv▸ Reading ~/.claude/skills/create-purchase-order/SKILL.md
✓ 4 steps · 2 params · 1 precondition
▸ Resolving precondition: signed in to supplier portal
✓ cookie present (expires 2026-02-19 12:00 UTC)
▸ Running batch (50 rows)
✓ 50/50 submitted
✓ 0 retries · 0 manual rescues
✓ median 3.8s per row · longest 5.1s
Uma frase entra, cinquenta ordens saem. O agente não fez nem uma pergunta.
Pós-escrito
O custo de um ritual de cinco minutos, amortizado num ano de trabalho.
Gratuito durante a beta aberta. Sem conta, sem upload, sem telemetria. O bundle completo são 4,5 MB; as gravações vivem na tua máquina até escolheres exportá-las.
