Angular : Les tests et le débogage

Tester les services

TESTEZ LINKEDIN LEARNING GRATUITEMENT ET SANS ENGAGEMENT

Tester maintenant Afficher tous les abonnements
Dans cette vidéo, vous allez voir comment effectuer un test avec un service qui apporte des données.
06:46

Transcription

Maintenant, que nous avons quelques tests de faits, allons-y avec un test qui nous permet de valider les services de l'application. Donc, on retourne dans VS Code, la première chose qu'on va faire, on va fermer le fichier ici et on va ouvrir le terminal, donc, on va aller dans Afficher, Terminal intégré, vous pouvez utiliser le raccourci, ensuite on va fermer le serveur de test, donc, contrôle C et puis je vais clearer ça ici, donc, la première chose qu'on va faire, c'est créer un nouveau service et on va utiliser les commandes du CLI pour faire ça, donc on va faire ng, tantôt j'ai fait generate là on va faire le raccourci g service que je vais appeler hero et on va insérer une petite option ici qui va nous aider à la rajouter automatiquement sur le module. Donc, on va faire tiret tiret module égal app. Donc, cette commande va créer le nouveau service et va la rajouter automatiquement sur le module donc on aura pas à le faire. Donc on a lié deux fichiers qui ont été créés et le module a été updaté automatiquement. OK, on va aller dans les deux nouveaux fichiers qu'on a créé, donc, le service ici qui est le spec, donc qui sont les tests et on va aller dans le service, ici. Donc, je vais faire deux petites choses pour commencer on va aller créer le service. Je vais retourner, après le constructor, sur la ligne six et qu'est ce qu'on va faire, on va copier/coller directement d'un autre fichier qu'on a en notre possession, donc, si on sort de VS Code et puis on s'en va dans les fichiers d'exercice et on va dans les ressources et le fichier ang-debug, celui qu'on a utilisé pour le chapitre de débugage et vous allez dans la source, vous allez dans app, vous allez avoir un fichier qui s'appelle ici in-memory.data.service on va ouvrir ce fichier, donc je vais faire un clic à la droite, je vais l'ouvrir dans VS Code et tout ce que je vais faire c'est que je vais copier le tableau ici du début à la fin, donc de la ligne cinq à partir du début du tableau, jusqu'à la fin, tout simplement le copier, ensuite, je vais aller dans mon service ici et je vais créer une fonction qui va retourner le tableau de mes héros. Donc, on va créer une nouvelle fonction, je vais l'appeler getHeroes et dans cette fonction je vais rajouter un return et je vais faire un coller de qu'est-ce que je viens de copier et j'enlève le caractère ici, maintenant, on peut sauvegarder la classe ici donc on a une fonction qui est disponible du service et on peut fermer l'autre fichier, ici, ensuite on va aller faire le test. Donc, le test va être très simple, la première chose qu'on va faire, qu'on a tout ce qu'on a besoin ici, donc, on a describe, on a le nom de notre test ici, donc on est corrects, on a déjà un premier petit test ici et on va aller en rajouter deux autres. Donc, tout simplement, ce que je vais faire, je vais copier le premier test ici et je vais le coller en-dessous, comme cela et je vais l'appeler 'should display heroes' donc on devrait montrer les héros. Je vais juste fermer mon explorateur ici deux petites secondes, qu'on puisse voir tout le code, tout ce que j'injecte, ici, est correct on garde la même syntaxe ici, ensuite, dans la fonction on va changer une couple de petites choses. Je vais carrément effacer ce que j'ai ici et je vais le changer avec un expect service, donc, on fait un chargement de service ici dans injection le service vient avec la fonction getHeroes si on revient ici on a une fonction qui est disponible, donc, on va retourner ici, on va pouvoir l'utiliser, expect getHeroes, donc on s'attend que la fonction getHeroes dot length, donc je m'attends que le tableau que la fonction, ici, retourne une longueur, ici, qu'est-ce que je vais faire, je vais utiliser une méthode qui vient de Jasmine, qui s'appelle toBeGreaterThan et je vais marquer zéro, donc je m'attends que la longueur du tableau qui va être retourné par le service qu'elle va être plus grand que zéro, donc, ça c'est mon premier test, on va sauvegarder tout ça, on va redémarrer le serveur de test s'il ne l'est pas déjà, donc, on va faire ng test, on retourne dans notre navigateur, on va le maximiser, donc, tous mes tests passent, le service Hero, should be created, donc ça marche et should display heroes, ça veut dire qu'il a accès au tableau heroes. Donc, on va aller enregistrer un autre juste par principe, je vais faire la même chose ici, je vais copier la ligne 16 à 18, je vais la coller et la seule affaire qu'on va changer ici, on va être très spécifique donc, should display 10 heroes. Donc, on s'attend à ce qu'il y ait 10 héros. Comme en ce moment, si on regarde, il y a à peu près 10 héros ici, oui, il y a justement 10 héros, OK, on va aller ici, on va tout simplement changer la dernière méthode ici, on va faire, très exactement, toBe et puis on va rajouter un chiffre qui est pas 10, je veux qu'on teste qu'est-ce qui se passe quand on a pas le chiffre qu'on veut ici donc on fait une sauvegarde, on revient ici et là, on a un test qui ne passe pas, donc, il envoie dix et il s'attend à avoir huit. Comme je vous ai expliqué dans une vidéo précédente, on a tout le temps le chiffre qui est passé dans la fonction et qu'est-ce qu'on s'attend d'avoir dans la fonction, comme ici, Expected 10, on s'attend qu'il y en ait huit. Donc, le test n'est pas valide, donc c'est très important de faire des tests pour évaluer qu'on a les résultats qu'on veut ou le contraire, quand on a pas les résultats qu'on veut pourquoi et on peut aller inspecter et évaluer le code après. Donc, je vais retourner et fixer la fonction ici, donc on s'attend à ce qui soit dix, pour s'assurer que ça passe, on retourne ici et tout est valide. Donc, voici comment qu'on fait des tests avec des services.

Angular : Les tests et le débogage

Découvrez les erreurs communes de cet environnement de développement telles que les erreurs d'injection ou de transformation de données, ainsi que les bonnes pratiques de conduite de tests.

1h24 (20 vidéos)
Aucun commentaire n´est disponible actuellement
Logiciel :
Spécial abonnés
Date de parution :7 juin 2018

Votre formation est disponible en ligne avec option de téléchargement. Bonne nouvelle : vous ne devez pas choisir entre les deux. Dès que vous achetez une formation, vous disposez des deux options de consultation !

Le téléchargement vous permet de consulter la formation hors ligne et offre une interface plus conviviale. Si vous travaillez sur différents ordinateurs ou que vous ne voulez pas regarder la formation en une seule fois, connectez-vous sur cette page pour consulter en ligne les vidéos de la formation. Nous vous souhaitons un excellent apprentissage avec cette formation vidéo.

N'hésitez pas à nous contacter si vous avez des questions !