---
title: Web recorder
description: Enregistrez un parcours web avec l'extension Chrome Kompagnon et transformez-le en steps de test.
lastUpdated: "2026-09-23"
---

> **For AI agents:** the complete documentation index is at [llms.txt](/llms.txt). Append `.md` to any page URL for its markdown version.

L'enregistrement est le moyen le plus rapide de créer un test web : parcourez votre scénario dans un vrai navigateur, et chaque click, input et navigation devient un step dans le builder. Le recorder fonctionne via **Kompagnon**, une extension Chrome qui pilote l'enregistrement et ajoute des vérifications sans quitter la page.

![Le side panel Kompagnon enregistrant en direct à côté de la page testée, avec un step de click capturé](/images/web-recorder-kompagnon.webp)

## Installer Kompagnon

Vous installez l'extension une seule fois, depuis le builder. Créez ou ouvrez un test **Web (New experience)**, puis cliquez sur **Use recorder**. Si Kompagnon n'est pas encore installé, une modale **Install the Kompagnon extension** décrit ses fonctionnalités et propose **Add to Chrome**, qui ouvre le Chrome Web Store. Installez-le et revenez au builder.

## Enregistrer un test

Une fois Kompagnon installé, **Use recorder** ouvre votre URL de départ dans un nouvel onglet avec le recorder attaché.

<Steps>
  <Step title="Parcourez votre scénario">
    Naviguez sur la page normalement. Les clicks, inputs et navigations sont capturés comme des steps en temps réel. Un widget déplaçable se superpose à la page et affiche le statut de l'enregistrement, le nombre d'actions capturées, ainsi que les boutons **Pause**, **Stop** et **Open sidepanel**.
  </Step>
  <Step title="Ouvrez le side panel">
    Cliquez sur **Open sidepanel** pour ancrer Kompagnon dans le side panel natif de Chrome. Il affiche l'état actuel (**RECORDING LIVE** ou **ASSERTION MODE**), la liste en direct des actions capturées avec leurs sélecteurs, et les mêmes contrôles de pause, stop et assertion.
  </Step>
  <Step title="Arrêtez et vérifiez">
    Cliquez sur **Stop**. Les steps enregistrés apparaissent dans le canvas du builder, regroupés et prêts à être modifiés, réordonnés ou enrichis avec des [variables](/fr/tests/variables) et des [checks](/fr/tests/builder#checks).
  </Step>
</Steps>

## Ajouter des vérifications pendant l'enregistrement

Vous pouvez ajouter des assertions sur la page sans quitter le recorder. Cliquez sur l'**icône œil** pour passer en assertion mode, puis cliquez sur l'élément à vérifier. Une modale **Verify element** s'ouvre pour configurer le check :

![La modale Verify element avec Displayed, Clickable, et les options Enabled et Present dépliées](/images/web-recorder-verify-element.webp)

- **Displayed** : l'élément est visible.
- **Clickable** : l'élément est cliquable.

**More options** révèle deux conditions supplémentaires :

- **Enabled** : l'élément est actif.
- **Present** : l'élément existe dans le DOM.

Choisissez une condition et la vérification est enregistrée comme un step [Verify element](/fr/tests/actions/web/verifyelement) aux côtés de vos interactions.

<Note>
Les steps enregistrés sont des steps classiques du builder. L'onglet **General** de chaque step web inclut une **Reference screenshot** de la page capturée lors de la dernière exécution du step, pour que vous puissiez voir exactement ce qu'il cible. Avant la première exécution, il affiche "No reference screenshot available for this step".
</Note>

## Legacy : recorder avec export de script

Avant Kompagnon, l'enregistrement web était fourni sous forme d'extension Chrome autonome qui exportait un **Web Script** en JavaScript à coller dans un test. Cette méthode fonctionne toujours pour les scripts existants, mais les nouveaux tests web doivent utiliser Kompagnon et le builder visuel décrit ci-dessus.

<Steps>
  <Step title="Charger l'extension">
    Téléchargez et décompressez `kapptivate-web-recorder.zip`, ouvrez `chrome://extensions`, activez le **Developer mode**, cliquez sur **Load unpacked**, et sélectionnez le dossier décompressé.
  </Step>
  <Step title="Enregistrer et exporter">
    Cliquez sur l'icône Kapptivate, cliquez sur **Record**, parcourez votre scénario, puis **Stop**, **Export** et **CopyToClipboard**.
  </Step>
  <Step title="Importer l'enregistrement">
    Créez un test avec une action **Web Script**, sélectionnez l'agent Ethernet par défaut, passez en mode **raw script**, et collez l'enregistrement. Sauvegardez et exécutez-le une fois avant de le connecter à un monitor.
  </Step>
</Steps>

L'export est une [script action](/fr/tests/actions/legacy/script-actions) : du JavaScript que vous pouvez modifier librement, enrichir d'assertions, ou compléter avec des [variables et métriques personnalisées](/fr/tests/actions/legacy/script-actions-variables).

## Et ensuite ?

<Columns cols={2}>
  <Card title="Test builder" icon="vial" href="/fr/tests/builder">

    Modifiez, regroupez et vérifiez les steps que vous avez enregistrés

</Card>
  <Card title="Verify element" icon="circle-check" href="/fr/tests/actions/web/verifyelement">

    Toutes les conditions disponibles pour vos assertions sur un élément web

</Card>
</Columns>