Tester le mode sombre, d'autres langues, d'autres écrans : un seul test pour toutes les variantes

Tester le mode sombre sans copier le test : gardez un seul test qui réussit en mode clair et sombre, dans chaque langue et sur chaque écran.

Par Ait Nohaila, Chargée de développement commercial 10 min de lecture

Pour tester le mode sombre, d'autres langues et d'autres écrans sans copier le test, gardez un seul test dont les assertions ont une version par variante.Une exécution choisit la variante, et les étapes restent les mêmes.

C'est l'un des problèmes les plus courants de l'automatisation des tests.Un test réussit en mode clair sur votre poste, puis échoue en mode sombre, en français ou sur l'ordinateur portable d'un collègue, alors que rien n'est cassé.

Pourquoi un test échoue-t-il en mode sombre alors que rien n'est cassé ?

Définition

Un test fait deux choses : il fait ce que fait un utilisateur, et il vérifie ce que montre l'écran.

  • Ce qu'il fait est le même dans chaque variante.

Ce qu'il vérifie ne l'est pas, car un écran correct n'a pas la même apparence en mode sombre, dans une autre langue ou sur un autre écran, et une assertion qui attend une seule apparence fait échouer les autres.

Dans GUI Test Studio, ce qu'une assertion attend est la cible visuelle d'une assertion visuelle, le texte attendu d'une assertion de texte, le format d'une assertion de texte dynamique ou l'agencement d'une assertion de disposition.L'enregistrement donne à chaque assertion sa première apparence attendue, appelée la version par défaut.

Mode sombre, autre langue, autre écran : ce qui change sur un écran correct

Un même écran peut à juste titre avoir une autre apparence.L'application n'est pas cassée, elle est affichée dans une autre variante, et une assertion qui n'a qu'une version ne peut pas faire la différence.

VarianteCe qui change sur un écran correct
Mode sombre et contraste élevéChaque arrière-plan, couleur de texte et icône change, donc chaque image diffère de l'apparence claire.
Une autre langueLes mots s'allongent ou raccourcissent, les boutons grandissent, le texte passe à la ligne, et une langue de droite à gauche inverse la disposition.
Un autre écranUn ordinateur portable à 150 % de mise à l'échelle et un écran 4K à 100 % dessinent le même bouton avec d'autres pixels.
Une autre version de WindowsLes polices, les coins, les ombres et les barres de défilement diffèrent entre Windows 10 et Windows 11.
Une autre édition de votre applicationLes couleurs et le logo d'un client en marque blanche, ou une fonctionnalité que seules certaines offres affichent.

Pourquoi copier le test pour chaque variante ne tient pas

Quand un écran correct échoue sans cesse dans une variante, les équipes ont en général recours à l'un de trois raccourcis.

Une copie par variante

Test de paiement · Clair
Test de paiement · Mode sombre
Test de paiement · Français
Test de paiement · Mise à l'échelle 150 %

Un changement du parcours se fait quatre fois.

Un seul test

Test de paiement

ClairMode sombreFrançaisMise à l'échelle 150 %

Un changement du parcours se fait une seule fois.

Les étapes d'un test sont les mêmes dans chaque variante. Seuls ce que les assertions attendent et ce que certaines étapes saisissent ou ouvrent diffèrent.
Le raccourciCe qu'il coûte
Une copie du test par varianteChaque changement du parcours se fait deux, trois ou cinq fois, et les copies divergent.
Une assertion plus soupleUne assertion assez souple pour accepter l'apparence sombre accepte aussi une icône manquante ou une mauvaise couleur dans l'apparence claire.
Aucune assertion visuelle dans cette varianteLe test clique toujours de bout en bout, mais un texte noir sur fond sombre part en production sans que personne le remarque.
Une assertion plus souple ne distingue pas une nouvelle apparence voulue d'un bug.Seule une apparence attendue pour cette variante le peut.

Pourquoi un test qui réussit peut quand même manquer ce que voient les utilisateurs, c'est le sujet de l'article Les bugs visuels que vos tests automatisés manquent.Pourquoi une assertion qui échoue sans raison est pire que pas d'assertion du tout, c'est expliqué dans Tests instables et faux positifs.

Ce qu'il faut dans un framework de test codé

Dans un framework codé comme Playwright, Selenium ou Cypress, c'est à vous de construire et d'entretenir les variantes dans le code.

Ce que vous entretenezDans un framework codéDans GUI Test Studio
Les images attenduesUn dossier de captures de référence pour chaque thème, langue et navigateur, gardé à côté du code des tests.Dans l'unique fichier du test, sous forme d'une version par variante de chaque assertion.
Changer de varianteUne configuration ou du code qui bifurque selon le thème ou la langue.Un profil choisi pour l'exécution.
Les mots saisis dans chaque langueDes données de test par langue, reliées au code des tests.Une version de l'étape Saisie de texte pour cette langue.
Une nouvelle apparence après un changement vouluUne exécution avec une option comme --update-snapshots, puis une revue des fichiers modifiés.Accepter la nouvelle apparence dans le rapport, en un clic, puis Enregistrer.

L'idée est la même : une variante, un ensemble d'attentes.Ce qui diffère, c'est ce que vous devez écrire et entretenir pour y arriver.

Un seul test pour toutes les variantes : les profils de référence

GUI Test Studio, qui automatise les tests de bout en bout sous Windows sans code, garde chaque version dans le test.Vous nommez vos variantes comme des profils de référence, par exemple Mode sombre, Français, Écran 4K ou Windows 10.Chaque assertion peut alors garder une version de ce qu'elle attend par profil, à côté de sa version par défaut.

Une assertion visuelle

Save

Par défaut

tel qu'enregistré

Save

Mode sombre

un profil que vous ajoutez

Enregistrer

Français

un profil que vous ajoutez

Partagé par toutes les versions

Où regarderCombien de temps attendreAvec quelle rigueur
Une assertion garde une apparence attendue par variante. Seul ce qu'elle attend change d'une version à l'autre.
MotSignification
Par défautCe qui a été enregistré.Ce profil peut être renommé mais jamais supprimé, et chaque exécution l'utilise sauf si vous choisissez un autre profil.
Profil de référenceUne variante nommée que vous ajoutez au test.Ce n'est qu'un nom tant que ses assertions n'ont pas leurs versions.
VersionL'apparence attendue d'une assertion pour un profil : une image, un texte, un format ou un agencement.

Chaque type d'assertion peut contenir des versions : assertions visuelles, assertions de texte, assertions de texte dynamique et assertions de disposition.Dans une assertion de groupe, chaque membre contient les siennes.Voir le guide des références pour chaque fenêtre concernée.

Ce qui change d'une variante à l'autre, et ce qui ne change jamais

Un profil change ce qu'une assertion attend.Il ne change jamais la façon dont l'assertion le cherche.

AssertionLa version d'un profil contientPartagé par toutes les versions
Assertion visuelleSa cible visuelle, l'image qu'elle cherche.La zone de recherche, le délai d'attente et la rigueur de vérification.
Assertion de texteLe texte attendu, sa précision et la casse.La zone de recherche et le délai d'attente.
Assertion de texte dynamiqueLe format de texte qu'elle attend.La zone de recherche et le délai d'attente.
Assertion de dispositionLes éléments et leur agencement.La zone de recherche et le délai d'attente.

Tester une application en plusieurs langues : les étapes changent aussi

Un test dans une autre langue a souvent besoin de plus que d'autres images.Il saisit d'autres mots, ouvre une autre adresse ou téléverse un autre fichier.Ainsi, chaque étape du test peut contenir la version d'un profil pour ce qu'elle fait, tandis que son emplacement à l'écran et son moment restent partagés.

ÉtapePar défautProfil Français
Saisie de texteHello, I need helpBonjour, j'ai besoin d'aide
Appui de toucheCtrl+BCtrl+G
Ouvrir une application webshop.example.com/enshop.example.com/fr
Téléverser un fichierinvoice.pdffacture.pdf
Lancer une applicationSetup.exeSetup.exe /lang=fr

Un raccourci peut aussi différer : dans Microsoft Word en français, le gras est Ctrl+G et non Ctrl+B, donc l'étape Appui de touche contient une version Français.

ExempleUn formulaire d'assistance en anglais et en français

La version par défaut saisit un message en anglais et attend la confirmation en anglais.Sous le profil Français, la même étape Saisie de texte saisit le message en français, et l'assertion de texte attend la confirmation en français.Un test, deux langues, et un changement du parcours se fait une seule fois.

La façon dont une assertion de texte lit et compare un texte est expliquée dans Assertions de texte.

Comment ajouter le mode sombre à un test existant, étape par étape

Le moyen le plus rapide de remplir un profil est une exécution sous ce profil.Les assertions dont l'apparence diffère échouent, vous les examinez, et vous gardez celles qui sont justes.

Exécuter

Sous le profil

Examiner

Chaque assertion échouée

Accepter

Pour ce profil

Sauvegarder

Dans le test

  1. 1

    Nommer le profil

    Dans Paramètres, Paramètres du projet, ajoutez un profil de référence nommé Mode sombre dans la carte Profils de référence.Un profil n'est qu'un nom tant que ses assertions n'ont pas reçu leurs versions.

  2. 2

    Exécuter le test sous le profil

    Passez votre application en mode sombre.Sur la page du test dans GUI Test Runner-Recorder, choisissez Mode sombre dans la ligne Référence, puis cliquez sur Exécuter le test.

    La ligne Référence choisit le profil de la prochaine exécution, et elle est mémorisée pour ce test.
  3. 3

    Examiner chaque assertion échouée

    Les assertions se comparent encore à l'apparence claire, donc celles dont l'apparence diffère échouent.Ouvrez chacune d'elles dans le rapport de confiance et décidez si l'apparence sombre est juste.

  4. 4

    Accepter les apparences sombres qui sont justes

    Cliquez sur Accepter le résultat obtenu comme référence pour « Mode sombre » sur chaque assertion que vous avez examinée.L'apparence claire par défaut reste telle qu'elle était.

    Lors d'une exécution sous un profil, le bouton Accepter range la nouvelle apparence sous ce profil.
  5. 5

    Sauvegarder, puis exécuter à nouveau

    Sauvegardez les modifications du rapport dans le test, et exécutez-le encore une fois sous Mode sombre.Chaque assertion se compare maintenant à sa propre version sombre.

Ou capturer la version dans GUI Test Studio

Sélectionnez une assertion, ouvrez son onglet Références et sélectionnez le profil.Chaque champ du panneau Propriétés montre maintenant la version de ce profil, et une modification de ce que l'assertion attend va dans cette version.Capturer... lance une capture d'écran avec la zone de l'assertion tracée là où elle se trouvait, et Capturer la même zone prend l'image du profil à cet endroit même.

Vous pouvez aussi demander à votre assistant IA d'ajouter un profil ou de capturer une version, avec Créer un test depuis une consigne.

Quand l'application change volontairement : accepter la nouvelle apparence en un clic

Une nouvelle apparence s'accepte quand l'application change volontairement.N'acceptez que ce que vous avez examiné, et gardez un moyen de revenir en arrière.

QuandQue faire dans GUI Test Studio
Une assertion a échoué et la nouvelle apparence est justeAcceptez le résultat obtenu dans le rapport de confiance.Ctrl+Z l'annule tant que vous n'avez pas sauvegardé.
L'élément n'a pas été trouvé du toutAcceptez sa meilleure zone, l'endroit le plus proche trouvé, comme nouvelle apparence attendue.
Un texte a changé volontairementModifiez le texte attendu dans le rapport.Sous un profil, la modification est sauvegardée comme version de ce profil.
La nouvelle apparence devient la principaleDéfinir par défaut fait de la version d'un profil la version par défaut et garde l'ancienne version par défaut sous ce profil.
Un profil est renommé ou suppriméFaites-le dans les Paramètres du projet : chaque assertion du test suit.

Mettre à jour un test après un changement détaille l'acceptation dans le rapport, et le rapport de confiance explique tout ce qu'il affiche.

Exécuter chaque variante en CI/CD

Cette exécution

Référence : Mode sombre

Bouton Sauvegarder · Assertion visuelle

sa version Mode sombre

Total de la commande · Assertion de texte

sa version Mode sombre

Logo de l'entreprise · Assertion visuelle

pas encore de version Mode sombre : la version par défaut est utilisée, et le rapport le signale

Une exécution utilise un profil. Chaque assertion se compare à sa version pour ce profil, ou à sa version par défaut quand elle n'en a pas.

Une exécution utilise un profil.Dans GUI Test Runner-Recorder, c'est la ligne Référence de la page du test.Sur un agent de build, gtr-cli prend --baseline-profile suivi du nom du profil.

Le même test, une fois par variante
gtr-cli run tests\Checkout.GTS --junit results\default.xml
gtr-cli run tests\Checkout.GTS --baseline-profile "Dark mode" --junit results\dark.xml
gtr-cli run tests\Checkout.GTS --baseline-profile "French" --junit results\french.xml
  • Une assertion sans version pour le profil se compare à sa version par défaut, et le rapport indique quel profil l'exécution a utilisé et combien d'assertions avaient une version pour lui.
  • Un nom de profil que le test n'a pas exécute la version par défaut, et gtr-cli le signale en listant les profils du test.
  • L'historique des exécutions garde le profil utilisé par chaque exécution.

Exécuter des tests dans votre pipeline liste toutes les options de gtr-cli.

Les navigateurs et les appareils se gèrent autrement

Un test web n'a pas besoin d'un profil par navigateur ou appareil : GUI Test Runner-Recorder génère une version du test enregistré pour Chrome, Edge, Firefox et des téléphones et tablettes émulés, avec des images relevées sur chacun.Voir Des tests multi-navigateurs à partir d'un seul enregistrement.

Les profils de référence servent à ce qui change l'apparence de la même application sur le même type d'écran : un thème, une langue, une mise à l'échelle, une version de Windows ou une édition de votre application.Cela fonctionne aussi bien pour les applications de bureau que pour les applications web, les jeux et les téléphones.

Ce qu'il faut savoir avant de commencer

LimiteCe que cela signifie
Un profil par exécutionDeux variantes, ce sont deux exécutions.Un pipeline exécute le test une fois par profil.
Une zone de recherche partagéeIl n'y a pas de zone de recherche par profil.Si un élément se trouve bien ailleurs dans une variante, élargissez la zone de recherche de l'assertion.
Pas d'ensembles par branche de codeIl n'y a pas d'ensembles séparés d'apparences attendues par branche de code.Pour préparer une nouvelle apparence avant sa livraison, remplissez un profil à partir d'exécutions, puis utilisez Définir par défaut à la livraison.

Points clés

  • 1Un test qui attend une seule apparence fait échouer un écran correct en mode sombre, dans une autre langue, avec une autre mise à l'échelle ou sur une autre version de Windows.
  • 2Les copies et les assertions assouplies ne tiennent pas : les copies divergent, et une assertion assouplie cache de vrais bugs.
  • 3GUI Test Studio garde chaque variante dans un seul test, une version par profil de référence, pour chaque assertion et chaque étape.
  • 4Où regarder, combien de temps attendre et avec quelle rigueur restent partagés, donc aucune variante ne rend le test plus indulgent.
  • 5Une exécution choisit une variante, et une nouvelle apparence vient de l'acceptation d'un résultat examiné dans le rapport de confiance.

Questions

Pourquoi mon test automatisé échoue-t-il en mode sombre ?

Parce qu'il attend l'apparence claire.Chaque assertion qui compare une image de l'écran voit d'autres couleurs en mode sombre et échoue, alors que l'application fonctionne.La solution n'est pas une assertion plus souple mais une version sombre de ce que chaque assertion attend.

Comment tester le mode sombre et le mode clair avec le même test ?

Gardez un seul test et donnez-lui un profil de référence Mode sombre.Exécutez-le une fois avec la version par défaut et une fois sous Mode sombre : les étapes sont les mêmes, et chaque assertion se compare à l'apparence de la variante exécutée.

Comment tester une application en plusieurs langues sans copier le test ?

Donnez au test un profil par langue.Sous le profil Français, une assertion de texte attend les mots français, une assertion visuelle l'image française, et une étape Saisie de texte saisit l'entrée française.Un changement du parcours se fait alors une seule fois pour toutes les langues.

Pourquoi mes tests échouent-ils avec une autre résolution d'écran ou une autre mise à l'échelle ?

Un ordinateur portable à 150 % et un écran 4K à 100 % dessinent le même bouton avec d'autres pixels, donc une image prise sur l'un ne correspond pas exactement à l'autre.Ajoutez un profil pour cet écran et acceptez son apparence une fois, à partir d'une exécution que vous avez examinée.

Que se passe-t-il quand une assertion n'a pas de version pour la variante que j'exécute ?

Elle se compare à sa version par défaut, l'apparence qui a été enregistrée.Le rapport de confiance indique quel profil l'exécution a utilisé et combien d'assertions avaient une version pour lui, donc un échec dû à une version manquante est facile à reconnaître.

Comment mettre à jour l'apparence attendue après un changement voulu ?

Examinez d'abord l'assertion en échec, et n'acceptez la nouvelle apparence que si le changement était voulu.Dans GUI Test Studio, le bouton Accepter du rapport de confiance le fait pour une assertion, de façon annulable, et Enregistrer l'écrit dans le test, sous le profil utilisé par l'exécution.

Puis-je exécuter chaque variante dans un pipeline CI/CD ?

Oui, une exécution par profil. gtr-cli prend --baseline-profile suivi du nom du profil, donc un pipeline exécute le test une fois avec la version par défaut et une fois par profil, chacune avec ses propres résultats.

Faut-il créer un profil pour chaque navigateur ?

Pas pour un test web.GUI Test Studio génère une version d'un test web enregistré pour Chrome, Edge, Firefox et des téléphones et tablettes émulés, avec des images relevées sur chacun.Les profils de référence servent à ce qui change l'apparence de la même application : un thème, une langue, un écran ou une version de Windows.

Playwright, Selenium, Cypress, Microsoft Word et Windows sont des marques de leurs propriétaires respectifs.

Tous les articles