Communitygithub.com

vercel-labs/slack

Interactúa con espacios de trabajo de Slack mediante automatización del navegador. Úsalo cuando el usuario necesite revisar canales no leídos, navegar en Slack, enviar mensajes, extraer datos, buscar información o automatizar cualquier tarea en Slack.

¿Qué es slack?

Esta habilidad proporciona automatización completa de Slack a través del navegador, eliminando la necesidad de la API de Slack o tokens OAuth. Con conectarse a una sesión existente de Slack (por ejemplo, `agent-browser connect 9222`) o abrir `https://app.slack.com`, la habilidad permite a los agentes de IA realizar acciones típicas de un usuario: revisar mensajes no leídos, navegar a canales, buscar conversaciones, extraer contenido de mensajes, obtener capturas de pantalla y tomar notas del estado. Está diseñada para plataformas como Claude Code, Cursor, Codex o cualquier entorno que soporte el comando `agent-browser`. La habilidad usa el árbol de accesibilidad del navegador para identificar elementos interactivos (referencias como `@e1`, `@e2`), lo que la hace robusta frente a cambios en la IU, pero requiere tomar instantáneas frecuentes después de cada navegación. Incluye prácticas recomendadas como la conexión a sesiones existentes para mayor velocidad, el uso de instantáneas JSON para análisis programático y la inserción de pausas para evitar limitaciones de tasa. También documenta las limitaciones: no tiene acceso a la API de Slack, depende de la sesión específica y puede enfrentar limitaciones de tasa si las interacciones son muy rápidas.

Compatible con~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/vercel-labs/agent-browser/tree/main/skill-data/slack

Preguntar en tu IA favorita

Abre un nuevo chat con esta habilidad de agente ya precargada.

Documentación

Automatización de Slack

Interactúa con espacios de trabajo de Slack para revisar mensajes, extraer datos y automatizar tareas comunes.

Inicio rápido

Conéctate a una sesión existente del navegador de Slack o abre Slack:

# Conectarse a una sesión existente en el puerto 9222 (típico para Slack ya abierto)
agent-browser connect 9222

# O abrir Slack si no está ejecutándose
agent-browser open https://app.slack.com

Luego toma una instantánea para ver qué está disponible:

agent-browser snapshot -i

Flujo de trabajo principal

  1. Conectar/Navegar: Abre o conéctate a Slack
  2. Instantánea: Obtén elementos interactivos con referencias (@e1, @e2, etc.)
  3. Navegar: Haz clic en pestañas, expande secciones o navega a canales específicos
  4. Extraer/Interactuar: Lee datos o realiza acciones
  5. Captura de pantalla: Captura evidencia de los hallazgos
# Ejemplo: Revisar canales no leídos
agent-browser connect 9222
agent-browser snapshot -i
# Buscar el botón "Más no leídos"
agent-browser click @e21  # Ref para el botón "Más no leídos"
agent-browser screenshot slack-unreads.png

Tareas comunes

Revisión de mensajes no leídos

# Conectar a Slack
agent-browser connect 9222

# Tomar instantánea para localizar el botón de no leídos
agent-browser snapshot -i

# Buscar:
# - Botón "Más no leídos" (normalmente cerca de la parte superior de la barra lateral)
# - Alternancia "No leídos" en la pestaña Actividad (muestra el conteo de no leídos)
# - Nombres de canales con insignias/texto en negrita que indican no leídos

# Navegar a la pestaña Actividad para ver todos los no leídos en una vista
agent-browser click @e14  # Pestaña Actividad (la ref puede variar)
agent-browser wait 1000
agent-browser screenshot activity-unreads.png

# O revisar la pestaña de MDs
agent-browser click @e13  # Pestaña de MDs
agent-browser screenshot dms.png

# O expandir "Más no leídos" en la barra lateral
agent-browser click @e21  # Botón Más no leídos
agent-browser wait 500
agent-browser screenshot expanded-unreads.png

Navegar a un canal

# Buscar canal en la barra lateral o por nombre
agent-browser snapshot -i

# Buscar el nombre del canal en la lista (ej., "engineering", "product-design")
# Hacer clic en la ref del treeitem del canal
agent-browser click @e94  # Ejemplo: ref del canal engineering
# Reemplazar `engineering` con el nombre del canal clickeado para que el encabezado
# del canal anterior no pueda satisfacer la espera mientras el nuevo canal aún se renderiza.
agent-browser wait --fn "document.querySelector('[data-qa=\"channel_header\"]')?.innerText.includes('engineering')"
agent-browser screenshot channel.png

Buscar mensajes/hilos

# Usar la búsqueda de Slack
agent-browser snapshot -i
agent-browser click @e5  # Botón de búsqueda (ref típica)
agent-browser fill @e_search "palabra clave"
agent-browser press Enter
# Coincidir la consulta enviada para que una búsqueda repetida no pueda reutilizar la ruta anterior.
agent-browser wait --fn "location.pathname.includes('/search') && new URL(location.href).searchParams.get('q') === 'palabra clave'"
agent-browser screenshot search-results.png

Extraer información del canal

# Obtener lista de todos los canales visibles
agent-browser snapshot --json > slack-snapshot.json

# Analizar nombres de canales y metadatos
# Buscar elementos treeitem con level=2 (subcanales bajo secciones)

Revisar detalles del canal

# Abrir un canal
agent-browser click @e_channel_ref
agent-browser wait 1000

# Obtener información del canal (miembros, descripción, etc.)
agent-browser snapshot -i
agent-browser screenshot channel-details.png

# Desplazarse por los mensajes
agent-browser scroll down 500
agent-browser screenshot channel-messages.png

Tomar notas/capturar estado

Cuando necesites documentar hallazgos de Slack:

# Tomar captura de pantalla anotada (muestra números de elementos)
agent-browser screenshot --annotate slack-state.png

# Tomar captura de pantalla de página completa
agent-browser screenshot --full slack-full.png

# Obtener URL actual para referencia
agent-browser get url

# Obtener título de la página
agent-browser get title

Estructura de la barra lateral

Entender la barra lateral de Slack ayuda a navegar eficientemente:

- Hilos
- Huddles
- Borradores y enviados
- Directorios
- [Encabezados de sección - Conexiones externas, Destacados, Canales, etc.]
  - [Canales listados como treeitems]
- Mensajes directos
  - [MDs listados]
- Apps
  - [Accesos directos de apps]
- Botón [Más no leídos] (alterna la lista de canales no leídos)

Refs clave a buscar:

  • @e12 - Pestaña Inicio (generalmente)
  • @e13 - Pestaña MDs
  • @e14 - Pestaña Actividad
  • @e5 - Botón de búsqueda
  • @e21 - Botón Más no leídos (varía según la sesión)

Pestañas en Slack

Después de hacer clic en un canal, verás pestañas:

  • Mensajes - Conversación del canal
  • Archivos - Archivos compartidos
  • Fijados - Mensajes fijados
  • Añadir canvas - Lienzo colaborativo
  • Otras pestañas dependiendo de la configuración del espacio de trabajo

Haz clic en las refs de las pestañas para cambiar de vista y obtener diferente información.

Extraer datos de Slack

Obtener contenido de texto

# Obtener texto de un mensaje o elemento
agent-browser get text @e_message_ref

Analizar árbol de accesibilidad

# Instantánea completa como JSON para análisis programático
agent-browser snapshot --json > output.json

# Buscar:
# - Nombres de canales (campo name en treeitem)
# - Contenido de mensajes (en elementos listitem/document)
# - Nombres de usuarios (elementos button con información de usuario)
# - Marcas de tiempo (elementos link con información de tiempo)

Contar no leídos

# Después de expandir la sección de no leídos:
agent-browser snapshot -i | grep -c "treeitem"
# Cada treeitem con un nombre de canal en la sección de no leídos es un no leído

Mejores prácticas

  • Conecta a sesiones existentes: Usa agent-browser connect 9222 si Slack ya está abierto. Es más rápido que abrir un nuevo navegador.
  • Toma instantáneas antes de hacer clic: Siempre usa snapshot -i para identificar refs antes de hacer clic en botones.
  • Vuelve a tomar instantáneas después de navegar: Después de navegar a un nuevo canal o sección, toma una nueva instantánea para encontrar nuevas refs.
  • Usa instantáneas JSON para análisis: Cuando necesites extraer datos estructurados, usa snapshot --json para una salida legible por máquina.
  • Pausa las interacciones: Agrega sleep 1 entre interacciones rápidas para permitir que la IU se actualice.
  • Revisa el árbol de accesibilidad: El árbol de accesibilidad muestra lo que los lectores de pantalla (y tu automatización) pueden ver. Si un elemento no está en la instantánea, puede estar oculto o requerir desplazamiento.
  • Desplázate en la barra lateral: Usa agent-browser scroll down 300 --selector ".p-sidebar" para desplazarte dentro de la barra lateral de Slack si la lista de canales es larga.

Limitaciones

  • No puede acceder a la API de Slack: Esto usa automatización del navegador, no la API de Slack. No se necesitan OAuth, webhooks ni tokens de bot.
  • Específico de la sesión: Las capturas de pantalla e instantáneas están vinculadas a la sesión actual del navegador.
  • Limitación de tasa: Slack puede limitar interacciones rápidas. Agrega demoras entre comandos si es necesario.
  • Específico del espacio de trabajo: Interactúas con tu propio espacio de trabajo (no hay automatización entre espacios de trabajo).

Depuración

Revisar errores en la consola

agent-browser console
agent-browser errors

Obtener estado actual de la página

agent-browser get url
agent-browser get title
agent-browser screenshot page-state.png

Ejemplo: Revisión completa de no leídos

#!/bin/bash

# Conectar a Slack
agent-browser connect 9222

# Tomar instantánea inicial
echo "=== Revisando no leídos de Slack ==="
agent-browser snapshot -i > snapshot.txt

# Revisar pestaña Actividad para no leídos
agent-browser click @e14  # Pestaña Actividad
agent-browser wait 1000
agent-browser screenshot activity.png
ACTIVITY_RESULT=$(agent-browser get text @e_main_area)
echo "Actividad: $ACTIVITY_RESULT"

# Revisar MDs
agent-browser click @e13  # Pestaña MDs
agent-browser wait 1000
agent-browser screenshot dms.png

# Revisar canales no leídos en la barra lateral
agent-browser click @e21  # Botón Más no leídos
agent-browser wait 500
agent-browser snapshot -i > unreads-expanded.txt
agent-browser screenshot unreads.png

# Resumen
echo "=== Resumen ==="
echo "Consulta activity.png, dms.png y unreads.png para detalles completos"

Referencias

Individual skills in this repo

This repo contains 8 individual skills — each has its own dedicated page.

agent-browser

Browser automation CLI for AI agents. Use when the user needs to interact with websites, including navigating pages, filling forms, clicking buttons, taking screenshots, extracting data, testing web apps, or automating any browser task. Triggers include requests to

vercel-labs/agentcore

Run agent-browser on AWS Bedrock AgentCore cloud browsers. Use when the user wants to use AgentCore, run browser automation on AWS, use a cloud browser with AWS credentials, or needs a managed browser session backed by AWS infrastructure. Triggers include "use agentcore", "run on AWS", "cloud browser with AWS", "bedrock browser", "agentcore session", or any task requiring AWS-hosted browser automation.

vercel-labs/derive-client

Reverse-engineer a website's internal API by recording browser traffic into a HAR file, then generate a standalone client or CLI that calls the endpoints directly, with no browser needed after the first recording. Use when asked to "derive a client", "build a CLI for <site>", "reverse engineer this site's API", "record network requests", "turn this site into an API", or when the same site will be automated repeatedly and direct HTTP calls would beat driving the browser every time.

vercel-labs/dogfood

Systematically explore and test a web application to find bugs, UX issues, and other problems. Use when asked to "dogfood", "QA", "exploratory test", "find issues", "bug hunt", "test this app/site/platform", or review the quality of a web application. Produces a structured report with full reproduction evidence -- step-by-step screenshots, repro videos, and detailed repro steps for every issue -- so findings can be handed directly to the responsible teams.

vercel-labs/electron

Automate Electron desktop apps (VS Code, Slack, Discord, Figma, Notion, Spotify, etc.) using agent-browser via Chrome DevTools Protocol. Use when the user needs to interact with an Electron app, automate a desktop app, connect to a running app, control a native app, or test an Electron application. Triggers include "automate Slack app", "control VS Code", "interact with Discord app", "test this Electron app", "connect to desktop app", or any task requiring automation of a native Electron application.

vercel-labs/protected-vercel-deployments

Access and test Vercel deployments protected by Vercel Authentication, SSO, or Deployment Protection with agent-browser. Use when a preview or production URL redirects to a Vercel login page, returns a protection 401 or 403, or needs short-lived Trusted Sources OIDC authentication instead of a static bypass secret or public exception.

vercel-labs/vercel-sandbox

Run agent-browser + Chrome inside Vercel Sandbox microVMs for browser automation from any Vercel-deployed app. Use when the user needs browser automation in a Vercel app (Next.js, SvelteKit, Nuxt, Remix, Astro, etc.), wants to run headless Chrome without binary size limits, needs persistent browser sessions across commands, or wants ephemeral isolated browser environments. Triggers include "Vercel Sandbox browser", "microVM Chrome", "agent-browser in sandbox", "browser automation on Vercel", or any task requiring Chrome in a Vercel Sandbox.

vercel-labs/webmcp-gen

Build and validate experimental WebMCP tools for an existing web page. Use when an agent needs to expose a site's real workflows as page tools, create webmcp.init.js, define deterministic checks, or compare WebMCP with accessibility-tree automation.

Skills relacionados