Nous vous invitons à regarder la vidéo ci-dessous pour découvrir ce nouveau panneau (fonctionnalité bêta).
Suivez ce tutoriel pour apprendre à utiliser le panneau Enregistreur pour enregistrer, revoir et évaluer les parcours utilisateur.
Pour savoir comment partager les parcours utilisateur enregistrés, les modifier et modifier leurs étapes, consultez la documentation de référence sur les fonctionnalités de l'enregistreur.
Ouvrir le panneau "Enregistreur"
- Accédez aux outils de développement.
Cliquez sur Autres options
> Plus d'outils > Enregistreur.
Vous pouvez également utiliser le menu de commandes pour ouvrir le panneau Enregistreur.
Introduction
Nous allons utiliser cette page de démonstration pour commander du café. Le paiement est un parcours utilisateur courant sur les sites de vente en ligne.
Dans les sections suivantes, nous allons vous expliquer comment enregistrer, revoir et auditer le parcours de paiement suivant avec le panneau Enregistreur :
- Ajouter un café au panier
- Ajouter un autre café au panier
- Accédez à la page du panier.
- Retirez un café du panier.
- Démarrez le processus de paiement.
- Saisissez les informations de paiement.
- Procédez au paiement.
Enregistrer un flux utilisateur
- Ouvrez cette page de démonstration. Cliquez sur le bouton Démarrer un nouvel enregistrement pour commencer.
- Saisissez "paiement du café" dans la zone de texte Nom de l'enregistrement.
- Cliquez sur le bouton Démarrer un nouvel enregistrement. L'enregistrement est lancé. Le message Enregistrement... s'affiche dans le panneau, ce qui indique que l'enregistrement est en cours.
- Cliquez sur Cappuccino pour l'ajouter au panier.
- Cliquez sur Americano pour l'ajouter au panier. Notez que les étapes que vous avez effectuées jusqu'à présent sont affichées dans l'Enregistreur.
- Accédez à la page du panier et supprimez Americano.
- Cliquez sur le bouton Total : 19,00 $ pour passer à l'étape de paiement.
- Dans le formulaire des détails du paiement, remplissez les zones de texte Nom et Adresse e-mail, puis cochez la case Je souhaite recevoir des notifications sur mes commandes et des messages promotionnels.
- Cliquez sur le bouton Envoyer pour terminer le processus de paiement.
- Dans le panneau Enregistreur, cliquez sur le bouton
Arrêter l'enregistrement pour mettre fin à l'enregistrement.
Revoir un flux utilisateur
Après avoir enregistré un parcours utilisateur, vous pouvez le revoir en cliquant sur le bouton 
Revoir.
Vous pouvez voir la relecture du flux utilisateur sur la page. La progression de la relecture est également indiquée dans le panneau Enregistreur.
Si vous avez fait un mauvais clic pendant l'enregistrement ou si quelque chose ne fonctionne pas, vous pouvez déboguer votre flux utilisateur: ralentir la relecture, définir un point d'arrêt et l'exécuter étape par étape.
Simuler un réseau lent
Vous pouvez simuler une connexion réseau lente en configurant les paramètres de nouvelle lecture. Par exemple, développez Paramètres de relecture, puis sélectionnez 3G lente dans la liste déroulante Réseau.
D'autres paramètres pourraient être pris en charge à l'avenir. Indiquez-nous les paramètres dont vous souhaitez disposer pour revoir des parcours utilisateur.
Évaluer un parcours utilisateur
Vous pouvez mesurer les performances d'un parcours utilisateur en cliquant sur le bouton Mesurer les performances. Par exemple, le paiement est un flux utilisateur essentiel d'un site Web d'achat. Le panneau Enregistreur vous permet d'enregistrer ce parcours une fois et de l'évaluer régulièrement.
En cliquant sur le bouton Évaluer les performances, vous reverrez d'abord le parcours utilisateur, puis la trace des performances dans le panneau Performances.
Découvrez comment analyser les performances d'exécution de votre page dans le panneau Performances. Vous pouvez cocher la case Signaux Web du panneau Performances pour afficher les métriques des signaux Web et identifier des opportunités pour améliorer l'expérience de navigation des utilisateurs.
Modifier les étapes
Voyons les options de base pour modifier les étapes du workflow enregistré.
Pour obtenir la liste complète des options de modification, consultez la section Étapes de modification dans la documentation de référence sur les fonctionnalités.
Développer les étapes
Développez chaque étape pour en afficher le détail. Par exemple, développez l'étape Cliquer sur l'élément "Cappuccino".
L'étape ci-dessus contient deux sélecteurs. Pour en savoir plus, consultez Comprendre le sélecteur d'enregistrement.
Lorsque vous revoyez le parcours utilisateur, l'Enregistreur tente d'interroger l'élément avec l'un des sélecteurs, dans un ordre précis. Par exemple, si l'Enregistreur interroge avec succès l'élément avec le premier sélecteur, il ignore le second sélecteur et passe à l'étape suivante.
Ajouter et supprimer des sélecteurs d'une étape
Vous pouvez ajouter ou supprimer n'importe quel sélecteur. Par exemple, vous pouvez supprimer le sélecteur 2, simplement parce que aria/Cappuccino suffit dans le cas présent. Pointez sur le sélecteur 2, puis cliquez sur - pour le supprimer.
Modifier des sélecteurs dans une étape
Vous pouvez également modifier le sélecteur. Par exemple, si vous voulez sélectionner Mocha plutôt que Cappuccino, vous pouvez :
Remplacez la valeur du sélecteur par aria/Mocha.
Vous pouvez également cliquer sur le bouton Sélectionner
, puis sur Mocha sur la page.Relancez le flux. Il devrait sélectionner Mocha au lieu de Cappuccino.
Essayez de modifier d'autres propriétés d'étape, telles que type, target, value, etc.
Ajouter et supprimer des étapes
Vous pouvez également ajouter et supprimer des étapes. Cela peut être utile si vous voulez ajouter une étape ou en supprimer une ajoutée par erreur. Au lieu de réenregistrer le flux utilisateur, vous pouvez simplement le modifier:
Effectuez un clic droit sur l'étape que vous souhaitez modifier ou cliquez sur l'icône à trois points
à côté. 
Vous pouvez sélectionner Supprimer l'étape pour la supprimer. Par exemple, l'événement Défilement après l'étape Mocha n'est pas nécessaire.
Imaginons que vous voulez attendre que les neuf cafés soient affichés sur la page avant d'effectuer une étape. Dans le menu de l'étape Café, sélectionnez Ajouter une étape avant.
Dans Élément Assert, modifiez la nouvelle étape comme suit :
- type: waitForElement
- sélecteur 1 : .cup
- opérateur: == (cliquez sur le bouton ajouter un opérateur)
- nombre : 9 (cliquez sur le bouton Ajouter un nombre)
Rejouez le parcours pour voir les modifications.
Étapes suivantes
Félicitations, vous avez terminé le tutoriel.
Pour découvrir d'autres fonctionnalités et workflows (par exemple, l'importation et l'exportation) liés à l'enregistreur, consultez la documentation de référence sur les fonctionnalités de l'enregistreur.