Le but de ce kata est, au travers de quelques exercices, de s'entraîner à l'écriture de test bout en bout (E2E) avec l'outil UUV.
L'application web pour laquelle nous devons écrire des tests E2E est Weather App.
Il s'agit d'une application simple qui affiche la météo pour quelques villes.
Vous pouvez soit ouvrir un codespace depuis ce dépôt ou effectuer les actions suivantes si vous développez depuis votre environnement local :
- Cloner ce dépôt Git au sein d'un répertoire que nous appellerons
KATA_HOME
- Installer l'autocomplétion dans l'IDE (Si intelliJ, ne pas exécuter en tant qu'administrateur)
- Ouvrir le projet dans l'IDE
- Ensuite lancer depuis un terminal :
npm install
- Exécuter le test
first-test.feature
:- Depuis Intellij : Lancer la tâche UUV "open" (si vous avez des soucis de droits, cochez la case
Use local npm script
) - Depuis un terminal :
npx uuv open
- Depuis Intellij : Lancer la tâche UUV "open" (si vous avez des soucis de droits, cochez la case
- Vous êtes prêt à commencer l'exercice
-
Hello World : Corriger le test pour qu'il soit passant
-
Homepage : Vérifier que sur la page d'accueil, les éléments suivants sont visibles:
- un titre
Welcome to Weather App
- un bouton
Get started
Voir la Solution
- un titre
-
Weather : Vérifier que depuis la page d'accueil, lorsqu'on clique sur
Get started
, alors les éléments suivants sont visibles:- un texte
Nothing to display
- La liste des villes dans le volet de gauche
['Douala', 'Tunis', 'Limoges']
Voir la Solution
- un texte
-
TownSelection : Vérifier que depuis la page avec l'url
https://e2e-test-quest.github.io/weather-app/?isStarted=true
, lorsqu'on sélectionne la villeDouala
, les éléments suivants sont visibles dans la partie détail :- un titre
Douala
- un texte
min: 10.8 °c
Voir la Solution
- un titre
-
Filter : Vérifier que depuis la page avec l'url
https://e2e-test-quest.github.io/weather-app/?isStarted=true
, lorsqu'on saisit le textei
dans le champ de recherche et qu'on clique sur le bouton rechercher, alors les villes disponibles :['Tunis', 'Limoges']
Voir la Solution -
Navigation au clavier : Vérifier que depuis la page avec l'url
https://e2e-test-quest.github.io/weather-app/
, lorsqu'on commence une navigation au clavier depuis le haut de la page, alors on voit les éléments suivants durant la navigation :- un lien
Weather App's Logo
- un lien
Home
- un bouton
Get started
See Solution
- un lien
-
Pour aller plus loin : Vous pouvez :
- Effectuez des vérifications d'accessibilité : Consulter cette page pour plus d'informations
- Vérifiez que vous avez respectez les recommandations de phrases basées sur l'accessibilité
- Mocker l'appel à l'url https://e2e-test-quest.github.io/weather-app/assets/data/mock.json pour changer la liste des villes disponibles
- Tester la fonctionnalité
Add new town
(remplissage du formulaire à la souris ainsi qu'au clavier) - Lancer les tests sur un ipad mini
- Créer une Phrase personnalisée pour la vérification des villes disponibles
Voir la Solution