gravar-site

Grabar sitio

El script abre el sitio en un navegador invisible, avanza el reloj cuadro a cuadro y entrega un mp4 que nunca se atasca, incluso con animaciones pesadas. Quien graba es el script, no la IA: el modelo solo elige el modo, ejecuta un comando y mira una imagen al final. Por eso ejecuta esta skill en el modelo más barato que tengas:

• Claude Code: Haiku (/model haiku) o Sonnet en esfuerzo bajo. Opus aquí es desperdicio.
• Codex / ChatGPT: el modelo mini o el de esfuerzo bajo.
• Otros agentes (Gemini CLI, Antigravity, Cursor): el modelo rápido (Flash o equivalente).

No abras subagente ni delegues a otro agente: el costo de explicar la tarea es mayor que el de ejecutar el comando.

Ejecutar

node "${CLAUDE_SKILL_DIR}/scripts/gravar.mjs" --url https://sitio.com --salida "C:/ruta/entregas/sitio-pc.mp4"

Primera vez en la máquina: cd "${CLAUDE_SKILL_DIR}/scripts" && npm install. El script encuentra solo el Chromium de Playwright y ffmpeg; si falta uno, el mensaje de error indica qué instalar. Tarda de 1 a 3 minutos.

Salida: el mp4 y una línea RESULTADO {...} con ok, duración, tamaño, verificaciones y hoja_de_contacto.

Dos modos

• Automático (predeterminado, sin guión): muestra la parte superior y pasa el ratón sobre el botón del menú; baja sección por sección; en cada una abre pestañas, despliega preguntas y respuestas, hace clic en opciones del formulario, escribe el nombre ("María") y un mensaje corto, pasa el ratón sobre botones y enlaces; vuelve al inicio. Límite de 75 s (--max 60 acorta). Sirve para la mayoría de los sitios; se probó en dos estructuras diferentes.
• Con guión (--guion guion.json): cuando el operador quiere una secuencia exacta o el automático se equivocó en algo. Formato y acciones en referencia/guion-ejemplo.json. Los selectores son los de Playwright (#id, .clase, text=Agendar, role=button[name="X"]).

Opciones: --viewport 1440x900, --fps 30, --bloquear dominio.com (agrega bloqueos), --sin-hoja.

Reglas que el script ya cumple

• Nunca envía formularios y nunca abre WhatsApp, Instagram ni otro sitio: los enlaces solo reciben el ratón por encima.
• Libera toda la red. El mapa, fuentes y vídeos incrustados solo cargan así; bloquear todo excepto el dominio del sitio deja el mapa roto y cambia la fuente de la marca.
• Espera a que el mapa y los iframes carguen en tiempo real antes de grabar la sección.
• Rechaza (ok: false) si el desplazamiento da un tirón, si se envía un formulario, si se abre una ventana o se sale del sitio.

Revisar antes de entregar (obligatorio)

1. Leer la imagen en hoja_de_contacto (12 fotogramas del vídeo completo). Buscar: pantalla blanca, imagen faltante, fuente cambiada, mapa con error, texto de prueba visible (XXXXXX, "lorem", CRP o teléfono provisional), cursor perdido.
2. Si algo está mal, corregir el sitio o usar el guión; no entregar con reservas.
3. Borrar la hoja (rm en la ruta de hoja_de_contacto) y decir al operador la ruta del mp4, duración y tamaño.

El vídeo va a la carpeta entregas/ del cliente. Enviarlo a él es decisión del operador.

Límites

• Solo horizontal. Para vídeo vertical, --viewport 390x844 cambia el tamaño pero no simula toque: tratarlo como extensión futura, no prometer.
• Sitio que requiere inicio de sesión o solo se abre con datos reales: usar guión y una URL de vista previa.
• Para regrabar después de modificar el sitio, publicar el cambio primero (el script graba la dirección pública o http://localhost:puerto con el servidor en funcionamiento).