Communitygithub.com

vercel-labs/slack

Interagissez avec les espaces de travail Slack via l'automatisation du navigateur. Utile pour vérifier les messages non lus, naviguer, envoyer des messages, extraire des données, rechercher des conversations ou automatiser toute tâche Slack.

Qu'est-ce que slack ?

Cette compétence permet à un agent AI d'interagir avec Slack en utilisant l'automatisation du navigateur via `agent-browser`. Elle repose sur la connexion à une session Slack existante (sur le port 9222) ou l'ouverture de l'interface web `https://app.slack.com`. Le flux de travail principal consiste à prendre des instantanés de la page pour identifier les éléments interactifs (référencés par `@e1`, `@e2`...), puis à naviguer entre les onglets (Activité, DM), à cliquer sur les canaux, à rechercher des messages ou à extraire le contenu textuel des conversations. La compétence couvre des tâches courantes comme la vérification des messages non lus, la navigation vers un canal spécifique, la recherche de mots-clés, l'extraction de données (noms de canaux, messages, utilisateurs) et la capture d'écran pour documenter l'état. Elle ne nécessite pas d'API Slack, de jeton OAuth ou de webhook, ce qui la rend simple à configurer mais limitée à l'automatisation du navigateur. Des bonnes pratiques sont fournies, comme prendre des instantanés avant chaque clic, utiliser le format JSON pour l'analyse programmatique et ajouter des délais entre les actions pour éviter le throttling de Slack.

Compatible avec~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/vercel-labs/agent-browser/tree/main/skill-data/slack
Voir l'original→Voir toutes les compétences

Demander à votre IA préférée

Ouvre une nouvelle conversation avec cette compétence d'agent déjà préchargée.

OpenAIChatGPTClaudeClaudeGeminiGeminiGrokGrokPerplexityPerplexityDeepSeekDeepSeek

Documentation

Automatisation Slack

Interagissez avec les espaces de travail Slack pour vérifier les messages, extraire des données et automatiser des tâches courantes.

Démarrage rapide

Connectez-vous à une session Slack existante ou ouvrez Slack :

# Se connecter à une session existante sur le port 9222 (typique pour Slack déjà ouvert)
agent-browser connect 9222

# Ou ouvrir Slack s'il n'est pas déjà lancé
agent-browser open https://app.slack.com

Ensuite, prenez un instantané pour voir ce qui est disponible :

agent-browser snapshot -i

Flux de travail principal

  1. Connecter/Naviguer : Ouvrir ou se connecter à Slack
  2. Instantané : Obtenir les éléments interactifs avec leurs références (@e1, @e2, etc.)
  3. Naviguer : Cliquer sur les onglets, développer les sections ou accéder à des canaux spécifiques
  4. Extraire/Interagir : Lire les données ou effectuer des actions
  5. Capture d'écran : Capturer une preuve des résultats
# Exemple : Vérifier les canaux non lus
agent-browser connect 9222
agent-browser snapshot -i
# Chercher le bouton "Plus de non lus"
agent-browser click @e21  # Réf du bouton "Plus de non lus"
agent-browser screenshot slack-unreads.png

Tâches courantes

Vérifier les messages non lus

# Se connecter à Slack
agent-browser connect 9222

# Prendre un instantané pour localiser le bouton des non lus
agent-browser snapshot -i

# Chercher :
# - Le bouton "Plus de non lus" (généralement en haut de la barre latérale)
# - Le bouton bascule des non lus dans l'onglet Activité (affiche le nombre de non lus)
# - Les noms de canaux avec des badges ou du texte en gras indiquant des non lus

# Naviguer vers l'onglet Activité pour voir tous les non lus en une vue
agent-browser click @e14  # Onglet Activité (la réf peut varier)
agent-browser wait 1000
agent-browser screenshot activity-unreads.png

# Ou vérifier l'onglet Messages directs
agent-browser click @e13  # Onglet Messages directs
agent-browser screenshot dms.png

# Ou développer "Plus de non lus" dans la barre latérale
agent-browser click @e21  # Bouton Plus de non lus
agent-browser wait 500
agent-browser screenshot expanded-unreads.png

Naviguer vers un canal

# Chercher un canal dans la barre latérale ou par son nom
agent-browser snapshot -i

# Chercher le nom du canal dans la liste (par exemple "engineering", "product-design")
# Cliquer sur la référence du canal (treeitem)
agent-browser click @e94  # Exemple : référence du canal engineering
# Remplacer `engineering` par le nom du canal cliqué afin que l'ancien en-tête
# ne puisse pas satisfaire l'attente pendant le rendu du nouveau canal.
agent-browser wait --fn "document.querySelector('[data-qa=\"channel_header\"]')?.innerText.includes('engineering')"
agent-browser screenshot channel.png

Trouver des messages/fils

# Utiliser la recherche Slack
agent-browser snapshot -i
agent-browser click @e5  # Bouton de recherche (réf typique)
agent-browser fill @e_search "mot-clé"
agent-browser press Enter
# Faire correspondre la requête soumise afin qu'une recherche répétée ne réutilise pas l'ancienne route.
agent-browser wait --fn "location.pathname.includes('/search') && new URL(location.href).searchParams.get('q') === 'mot-clé'"
agent-browser screenshot search-results.png

Extraire les informations d'un canal

# Obtenir la liste de tous les canaux visibles
agent-browser snapshot --json > slack-snapshot.json

# Analyser pour les noms et métadonnées des canaux
# Chercher les éléments treeitem avec level=2 (sous-canaux sous les sections)

Vérifier les détails d'un canal

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

# Obtenir les informations du canal (membres, description, etc.)
agent-browser snapshot -i
agent-browser screenshot channel-details.png

# Parcourir les messages
agent-browser scroll down 500
agent-browser screenshot channel-messages.png

Prendre des notes/Capturer l'état

Lorsque vous devez documenter les résultats de Slack :

# Prendre une capture d'écran annotée (affiche les numéros d'éléments)
agent-browser screenshot --annotate slack-state.png

# Prendre une capture d'écran pleine page
agent-browser screenshot --full slack-full.png

# Obtenir l'URL actuelle pour référence
agent-browser get url

# Obtenir le titre de la page
agent-browser get title

Structure de la barre latérale

Comprendre la barre latérale de Slack vous aide à naviguer efficacement :

- Fils
- Huddles
- Brouillons et envoyés
- Annuaires
- [En-têtes de section - Connexions externes, Favoris, Canaux, etc.]
  - [Canaux listés comme treeitems]
- Messages directs
  - [Messages directs listés]
- Applications
  - [Raccourcis d'applications]
- Bouton [Plus de non lus] (affiche/masque la liste des canaux non lus)

Références clés à rechercher :

  • @e12 - Onglet Accueil (généralement)
  • @e13 - Onglet Messages directs
  • @e14 - Onglet Activité
  • @e5 - Bouton de recherche
  • @e21 - Bouton Plus de non lus (varie selon la session)

Onglets dans Slack

Après avoir cliqué sur un canal, vous verrez des onglets :

  • Messages - Conversation du canal
  • Fichiers - Fichiers partagés
  • Épinglés - Messages épinglés
  • Ajouter un canvas - Canvas collaboratif
  • Autres onglets selon la configuration de l'espace de travail

Cliquez sur les références des onglets pour changer de vue et obtenir différentes informations.

Extraire des données de Slack

Obtenir le contenu textuel

# Obtenir le texte d'un message ou d'un élément
agent-browser get text @e_message_ref

Analyser l'arbre d'accessibilité

# Instantané complet au format JSON pour une analyse programmatique
agent-browser snapshot --json > output.json

# Chercher :
# - Noms de canaux (champ name dans treeitem)
# - Contenu des messages (dans les éléments listitem/document)
# - Noms d'utilisateurs (éléments button avec informations utilisateur)
# - Horodatages (éléments link avec informations temporelles)

Compter les non lus

# Après avoir développé la section des non lus :
agent-browser snapshot -i | grep -c "treeitem"
# Chaque treeitem avec un nom de canal dans la section des non lus est un message non lu

Bonnes pratiques

  • Connectez-vous aux sessions existantes : Utilisez agent-browser connect 9222 si Slack est déjà ouvert. C'est plus rapide que d'ouvrir un nouveau navigateur.
  • Prenez des instantanés avant de cliquer : Faites toujours snapshot -i pour identifier les références avant de cliquer sur les boutons.
  • Refaites un instantané après la navigation : Après avoir navigué vers un nouveau canal ou une nouvelle section, prenez un nouvel instantané pour trouver de nouvelles références.
  • Utilisez les instantanés JSON pour l'analyse : Lorsque vous devez extraire des données structurées, utilisez snapshot --json pour une sortie lisible par machine.
  • Espacer les interactions : Ajoutez sleep 1 entre des interactions rapides pour laisser le temps à l'interface de se mettre à jour.
  • Vérifiez l'arbre d'accessibilité : L'arbre d'accessibilité montre ce que les lecteurs d'écran (et votre automatisation) peuvent voir. Si un élément n'est pas dans l'instantané, il peut être masqué ou nécessiter un défilement.
  • Défilez dans la barre latérale : Utilisez agent-browser scroll down 300 --selector ".p-sidebar" pour faire défiler la barre latérale de Slack si la liste des canaux est longue.

Limitations

  • Impossible d'accéder à l'API Slack : Cette compétence utilise l'automatisation du navigateur, pas l'API Slack. Aucun OAuth, webhook ou jeton de bot n'est nécessaire.
  • Propre à la session : Les captures d'écran et les instantanés sont liés à la session de navigateur actuelle.
  • Limitation de débit : Slack peut limiter le débit des interactions rapides. Ajoutez des délais entre les commandes si nécessaire.
  • Propre à l'espace de travail : Vous interagissez avec votre propre espace de travail -- pas d'automatisation entre espaces de travail.

Débogage

Vérifier la console pour les erreurs

agent-browser console
agent-browser errors

Obtenir l'état actuel de la page

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

Exemple : Vérification complète des non lus

#!/bin/bash

# Se connecter à Slack
agent-browser connect 9222

# Prendre un premier instantané
echo "=== Vérification des non lus Slack ==="
agent-browser snapshot -i > snapshot.txt

# Vérifier l'onglet Activité pour les non lus
agent-browser click @e14  # Onglet Activité
agent-browser wait 1000
agent-browser screenshot activity.png
ACTIVITY_RESULT=$(agent-browser get text @e_main_area)
echo "Activité : $ACTIVITY_RESULT"

# Vérifier les messages directs
agent-browser click @e13  # Onglet Messages directs
agent-browser wait 1000
agent-browser screenshot dms.png

# Vérifier les canaux non lus dans la barre latérale
agent-browser click @e21  # Bouton Plus de non lus
agent-browser wait 500
agent-browser snapshot -i > unreads-expanded.txt
agent-browser screenshot unreads.png

# Résumé
echo "=== Résumé ==="
echo "Voir activity.png, dms.png et unreads.png pour les détails complets"

Références

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 associés

steipete/sag

ElevenLabs text-to-speech with mac-style say UX.

community

steipete/oracle

Oracle CLI second-model review/debug/refactor/design with selected files, dry-run token checks, API or browser engine.

community

steipete/peekaboo

Capture and automate macOS UI with the Peekaboo CLI.

community

mattpocock/design-an-interface

Generate multiple radically different interface designs for a module using parallel sub-agents. Use when user wants to design an API, explore interface options, compare module shapes, or mentions "design it twice".

community

mattpocock/prototype

Build a throwaway prototype to flesh out a design — a runnable terminal app for state/business-logic questions, or several radically different UI variations toggleable from one route.

community

mattpocock/grill-me

Interview the user relentlessly about a plan or design until reaching shared understanding, resolving each branch of the decision tree. Use when user wants to stress-test a plan, get grilled on their design, or mentions "grill me".

community