Considérations sur fireEvent
Cette page a été traduite par PageTurner AI (bêta). Non approuvée officiellement par le projet. Vous avez trouvé une erreur ? Signaler un problème →
Interactions vs événements
Conformément aux Principes directeurs, vos tests devraient
reproduire autant que possible la façon dont les utilisateurs interagissent avec votre code (composant, page, etc.).
Dans cet esprit, sachez que fireEvent ne correspond pas exactement
aux interactions utilisateur réelles, mais constitue une approximation suffisante pour
la plupart des scénarios.
Prenons fireEvent.click : il crée un événement de clic et le déclenche
sur le nœud DOM spécifié. Cela fonctionne dans la plupart des cas où vous souhaitez
simplement tester le comportement lors d'un clic sur votre élément. Cependant, lorsqu'un
utilisateur clique réellement, la séquence typique d'événements déclenchés est (dans l'ordre) :
fireEvent.mouseOver(element)
fireEvent.mouseMove(element)
fireEvent.mouseDown(element)
element.focus() (si l'élément est focusable)
fireEvent.mouseUp(element)
fireEvent.click(element)
De plus, si l'élément est enfant d'un label, le focus sera déplacé
vers le contrôle de formulaire associé. Ainsi, même si votre objectif est simplement
de tester le gestionnaire de clic, l'usage exclusif de fireEvent.click vous prive
de plusieurs autres événements potentiellement importants déclenchés par l'utilisateur.
Dans la majorité des cas, cette limitation n'est pas critique et le compromis
lié à l'utilisation simplifiée de fireEvent.click reste justifié.
Alternatives
Nous décrirons quelques ajustements simples pour renforcer la fiabilité
de vos tests concernant le comportement interactif des composants. Pour d'autres
interactions, envisagez d'utiliser
user-event ou de tester vos composants dans un environnement réel
(manuellement, automatiquement avec Cypress, etc.).
Keydown (Touche enfoncée)
Un événement keydown est déclenché sur l'élément focusé, le body ou le document. Privilégiez donc cette approche :
- fireEvent.keyDown(getByText('click me'));
+ getByText('click me').focus();
+ fireEvent.keyDown(document.activeElement || document.body);
Cela vérifie également que l'élément concerné peut recevoir des événements clavier.
Focus/Blur
Lorsqu'un élément est focusé, un événement focus est déclenché, l'élément actif change dans le document,
et l'élément précédemment focusé est bluré. Pour simuler ce comportement, remplacez fireEvent par un focus impératif :
- fireEvent.focus(getByText('focus me'));
+ getByText('focus me').focus();
Un avantage notable : toute assertion sur les événements focus échouera si l'élément n'est pas focusable. Ceci est particulièrement crucial avant un événement keydown.