# Browser Tool (/fr/docs/verdent-for-vscode/core-features/browser-tool)

> Automatisez les interactions web, testez des interfaces utilisateur et capturez des captures d'écran à l'aide de sessions de navigateur



Le Browser Tool permet des interactions de navigateur pilotées par IA. Lancez des sessions de navigateur, cliquez sur des éléments, saisissez du texte, faites défiler des pages et capturez des captures d'écran grâce à des commandes en langage naturel.

### Ce que vous allez apprendre [#ce-que-vous-allez-apprendre]

* Cycle de vie d'une session : lancer → interagir → fermer
* Actions du navigateur : cliquer, saisir, faire défiler
* Cas d'usage : tests d'interface utilisateur, captures d'écran, navigation

***

## Cycle de vie d'une session [#cycle-de-vie-dune-session]

Chaque flux de travail d'automatisation du navigateur suit une séquence stricte :

1. **Lancer** - Démarrez une session de navigateur sur une URL cible
2. **Interagir** - Effectuez des actions (cliquer, saisir, faire défiler)
3. **Fermer** - Terminez la session pour libérer les ressources

L'état du navigateur persiste entre les actions au sein d'une même session. Vous devez fermer le navigateur avant d'utiliser d'autres outils Verdent.

<Tip>
  Chaque action renvoie une capture d'écran montrant l'état actuel du navigateur. Examinez les captures d'écran entre les actions pour vérifier leur succès avant de poursuivre.
</Tip>

***

## Actions du navigateur [#actions-du-navigateur]

<Tabs>
  <Tab title="launch">
    **Démarrer une nouvelle session de navigateur**

    * Requis : URL cible
    * Ouvre le navigateur en résolution 1920x1080
    * Toujours la première action de tout flux de travail

    ```
    Launch browser at https://example.com
    ```
  </Tab>

  <Tab title="click">
    **Cliquer à des coordonnées spécifiques**

    * Requis : coordonnées x, y
    * Les coordonnées sont relatives à la fenêtre d'affichage
    * Cible le centre des éléments pour plus de fiabilité

    ```
    Click coordinates 450,300
    ```
  </Tab>

  <Tab title="type">
    **Saisir du texte via le clavier**

    * Requis : texte à saisir
    * Saisit dans l'élément actuellement ciblé
    * Suit souvent un clic sur un champ de saisie

    ```
    Type "user@example.com"
    ```
  </Tab>

  <Tab title="scroll">
    **Faire défiler la page**

    * `scroll_down` - Fait défiler d'une hauteur de page vers le bas
    * `scroll_up` - Fait défiler d'une hauteur de page vers le haut
    * Révèle le contenu hors écran

    ```
    Scroll down to load more content
    ```
  </Tab>

  <Tab title="close">
    **Terminer la session de navigateur**

    * Toujours la dernière action de tout flux de travail
    * Requis avant d'utiliser d'autres outils
    * Libère les ressources du navigateur

    ```
    Close browser
    ```
  </Tab>
</Tabs>

<Tip>
  Les coordonnées sont relatives à la fenêtre d'affichage 1920x1080. Le centre se situe approximativement à (960, 540). Utilisez les captures d'écran pour estimer la position des éléments.
</Tip>

***

## Cas d'usage courants [#cas-dusage-courants]

<Tabs>
  <Tab title="Tests d'interface utilisateur">
    **Tester les soumissions de formulaires et les flux de navigation**

    Lancez le navigateur sur une page de connexion, cliquez sur les champs de saisie, saisissez les identifiants, soumettez les formulaires et vérifiez les résultats à l'aide des captures d'écran.

    ```
    Launch browser at https://app.example.com/login
    Click coordinates 450,280
    Type "testuser@example.com"
    Click coordinates 450,340
    Type "password123"
    Click coordinates 500,420
    Close browser
    ```
  </Tab>

  <Tab title="Captures d'écran">
    **Capturer des pages pour la documentation**

    Les captures d'écran sont réalisées automatiquement après chaque action. Naviguez vers les pages et sections cibles pour construire une documentation visuelle.

    ```
    Launch browser at https://docs.example.com
    Scroll down to API section
    Close browser
    ```
  </Tab>

  <Tab title="Navigation">
    **Naviguer vers le contenu cible**

    Utilisez l'automatisation du navigateur pour atteindre du contenu nécessitant une interaction (clic sur des menus, chargement de contenu différé) avant l'extraction.

    ```
    Launch browser at https://store.example.com
    Scroll down three times
    Click "Next Page" at 960,800
    Close browser
    ```
  </Tab>
</Tabs>

***

## Limitations [#limitations]

* **Exclusivité de l'outil** - Seul browser\_action peut être utilisé pendant les sessions actives
* **Basé sur les coordonnées** - Nécessite des coordonnées x, y, et non des sélecteurs CSS
* **Résolution fixe** - La fenêtre d'affichage du navigateur est verrouillée à 1920x1080
* **Chrome uniquement** - Puppeteer prend en charge les navigateurs Chrome/Chromium
* **Pas de persistance** - Les sessions ne survivent pas aux redémarrages de Verdent
* **Pas de prise en charge de WSL** - Browser Tool ne fonctionne pas dans les environnements WSL
* **Pas d'état enregistré** - Chaque session démarre à neuf, sans cookies ni authentification
* **Session unique** - Une seule session de navigateur peut être active à la fois

<Tip>
  Fermez toujours la session de navigateur avant d'utiliser des opérations sur les fichiers, des outils de recherche ou des commandes bash. Le navigateur verrouille les autres outils pendant les sessions actives.
</Tip>

***

## Voir aussi [#voir-aussi]

<CardGroup cols="3">
  <Card title="Diff de code" icon="code-compare" href="/docs/verdent-for-vscode/core-features/code-diff">
    Examinez et validez les modifications de code
  </Card>
</CardGroup>
