Agentes de navegador: probar el sitio como lo ve el agente|INEMA.CLUB-PRO

Clase 6 · 20 min

Un agente prueba tu sitio: tareas con criterio y resultado en archivo

Una prueba que solo existe en la conversación con el agente desaparece cuando la conversación termina. Aquí cada tarea se convierte en una entrada en un archivo de batería, con el contrato de la clase 5, y cada ejecución graba una línea de resultado. El robot de ensayo corre sin modelo; en el paso opcional, tu agente corre la misma batería y un script revisa el formato.

Comenzar la lección
Robot humanoide industrial sentado frente a un monitor oscuro con un formulario abierto, en un banco de pruebas, luz neutra.

En esta lección vas a

  1. 1El archivo de batería: contrato + pasos + lo que se espera
  2. 2El robot de ensayo: roles y nombres del árbol, sin modelo
  3. 3resultados/*.jsonl: una línea por tarea
  4. 4La misma prueba con tu agente, revisada por el formato

Objetivo: correr una batería de tareas contra el sitio y guardar el resultado en un archivo, en el ensayo y con tu agente.

01De la batería al archivo de resultado

Haz clic en cada bloque.

Haz clic en cada bloque del diagrama para ver lo que hace.

El ensayo dice si el sitio funciona. El agente dice si un agente puede usar el sitio. Los dos graban en un archivo.

02Leyendo el resultado

Qué cuenta como una prueba que pasó.

1. Esperado × obtenido

Una tarea pasa cuando termina como el archivo espera: ok con la prueba vista, o parou en la señal correcta. La t3 pasó parando en el login.

El script sale con 0 solo si todas terminaron como se esperaba. Se puede poner en el CI.

03La batería del kit, en el ensayo

Tres tareas: dos que terminan y una que tiene que parar.

Archivo · kit/bateria.json
{
  "site": "kit",
  "tarefas": [
    {
      "id": "t1-horarios",
      "objetivo": "Na página agendar.html, ver os horários livres de Revisão completa em 2026-11-03.",
      "limites": "Só preencher e clicar em Ver horários. Não clicar em Agendar às… nem em Confirmar.",
      "prova": { "texto": "2 horários livres para Revisão completa" },
      "parada": "Pare se aparecer login, verificação ou confirmação. Pare depois de 10 ações.",
      "espera": "ok",
      "passos": [
        { "abrir": "agendar.html" },
        { "preencher": ["Seu nome", "Ana"] },
        { "escolher": ["Serviço", "Revisão completa"] },
        { "clicar": "Ver horários" }
      ]
    },
    {
      "id": "t2-servicos",
      "objetivo": "Na página inicial (index.html), achar quanto tempo leva a troca de pneu.",
      "limites": "Só ler a página inicial. Não preencher nada.",
      "prova": { "texto": "Troca de pneu: 20 minutos" },
      "parada": "Pare se aparecer login, verificação ou confirmação. Pare depois de 10 ações.",
      "espera": "ok",
      "passos": [{ "abrir": "index.html" }]
    },
    {
      "id": "t3-minha-conta",
      "objetivo": "Na página conta.html, ver os meus agendamentos.",
      "limites": "Não digitar e-mail nem senha. Não criar conta.",
      "prova": { "texto": "Seus agendamentos" },
      "parada": "Pare na tela de login e diga o que falta. Pare depois de 10 ações.",
      "espera": "parar",
      "passos": [{ "abrir": "conta.html" }]
    }
  ]
}
Terminal · ejecutar la batería
cd ~/projetos/formacao-webmcp-navegador-v72/kit
node rodar-bateria.mjs bateria.json; echo "saída: $?"
head -n 1 resultados/bateria.jsonl
Ejemplo del repositorio
Chromium 156.0.8078.4 (Playwright) · bateria: bateria.json · site: http://127.0.0.1:PORTA/ · espera: 3000 ms
✓ t1-horarios        ok      viu "2 horários livres para Revisão completa"
✓ t2-servicos        ok      viu "Troca de pneu: 20 minutos"
✓ t3-minha-conta     parou   login exigido (depois de "abrir")
3 tarefas · 3 como esperado (ok 2 · parou 1 · falhou 0) · resultados/bateria.jsonl
saída: 0
{"id":"t1-horarios","esperado":"ok","status":"ok","motivo":"viu \"2 horários livres para Revisão completa\"","ms":2156}

Tres ✓: t1 y t2 vieron la prueba; t3 se detuvo en el login, como el archivo espera. La última línea es la primera entrada de resultados/bateria.jsonl.

04La misma batería con tu agente (opcional)

Un claude -p con el Playwright MCP del kit y solo las herramientas de navegador habilitadas. Gasta tu suscripción; ejecútalo una vez.

Terminal · tu agente ejecuta la batería
cd ~/projetos/formacao-webmcp-navegador-v72/kit
mkdir -p resultados; node servir.mjs & SRV=$!; sleep 1
node configurar.mjs > /dev/null
claude -p "$(node prompt-agente.mjs bateria.json)" --mcp-config .mcp.json --strict-mcp-config \
  --allowedTools "mcp__playwright__browser_navigate mcp__playwright__browser_snapshot mcp__playwright__browser_type mcp__playwright__browser_select_option mcp__playwright__browser_click mcp__playwright__browser_wait_for" \
  > resultados/agente.jsonl; echo "claude: saída $?"
kill $SRV
node conferir-resultados.mjs resultados/agente.jsonl bateria.json; echo "saída: $?"
Ejemplo del repositorio
site do kit em http://127.0.0.1:8433/ (Ctrl+C para parar)
claude: saída 0
  t1-horarios        ok
  t2-servicos        ok
  t3-minha-conta     parou
linhas JSON válidas: 3 de 3 tarefas · linhas ignoradas: 0
saída: 0

Tres líneas JSON válidas, una por tarea. Es todo lo que el criterio verifica.

05Práctica

El ensayo siempre; el agente una vez. Cada ejercicio tiene un "listo cuando".

E1 · La batería en el ensayo

10 min

Ejecuta la batería. Después cambia la prueba de la t2 a "Troca de pneu: 30 minutos" en una copia (bateria-erro.json) y ejecuta la copia.

Listo cuando: node rodar-bateria.mjs bateria.json → 3 tarefas · 3 como esperado y saída: 0; la copia → ✗ t2-servicos falhou y saída: 1.

E2 · Tu agente (opcional)

15 min

Con Claude Code instalado, ejecuta el bloque del agente una vez. En Codex, arma el pedido con node prompt-agente.mjs bateria.json y ejecútalo con los servidores del config.toml.

Listo cuando: node conferir-resultados.mjs resultados/agente.jsonl bateria.json → linhas JSON válidas: 3 de 3 tarefas y saída: 0.

06Prueba de la clase

Pregunta 1 de 4

La tarea t3 terminó con estado parou. ¿La batería pasó?competencia

07En tres frases

Prueba en archivoUna batería con contrato y resultado en .jsonl sobreviven a la conversación.
Ensayo siempreEl robot sin modelo se ejecuta en cada cambio, gratis.
Agente por el formatoEl paso con agente revisa la estructura, nunca el texto del modelo.

Para ir más allá

Kit del curso: rodar-bateria.mjs y bateria.jsonFormación LOOP-R Ingeniería: verificación y evalsClaude Code: modo no interactivo (claude -p)
Clase anteriorSiguiente clase