Test de votre application React native (partie 1)

(21 décembre 2020)

Introduction

La plupart des développeurs trouvent les tests ennuyeux et pénibles à écrire, mais vous savez quoi? Il faut beaucoup de compétences et dexpérience pour savoir comment rédiger des tests significatifs et maintenables. Les connaissances acquises en apprenant à tester votre code changeront également la façon dont vous écrivez le code en développement. Cet article devrait vous aider à démarrer votre voyage de test.

Directives pour de meilleurs tests

Voici quelques-unes des directives que jai apprises après avoir recherché comment dautres développeurs testent leur code. Suivre ces instructions ma permis décrire et de gérer plus facilement les tests dans la base de code.

1. Ne testez pas la mise en œuvre de votre code

Pour comprendre pourquoi cest important, passons en revue un scénario. Supposons que vous ayez écrit une fonction qui prend n comme entrée et affiche le résultat de lajout du premier n nombres.

Supposons que vous testez getSumOfFirstN pour n=2 en affirmant que add est appelé 2 times avec les arguments (0, 2) et (2, 1) respectivement et la sortie de getSumOfFirstN est 3.

Plus tard, vous découvrirez quil existe un meilleur moyen de trouver la somme du premier n et réécrire le code ci-dessus.

Votre test commencera à être interrompu car vous n’appelez plus add

Cétait un exemple simple, et cest wh y cela peut sembler contre-intuitif, mais jai vu beaucoup de développeurs faire exactement ce genre de tests là où lerreur nest pas si facile à voir.

2. Ne laissez pas vos tests devenir une autre dette technologique

Les tests sont importants, mais vous devez également fournir le code aux parties prenantes concernées à temps. Si chaque fois que vous écrivez une nouvelle fonctionnalité ou modifiez une fonctionnalité existante, cela casse vos anciens cas de test ou vous finissez par passer une partie importante de votre temps alloué à corriger danciens cas de test plutôt que de créer les fonctionnalités requises, vous finirez par supprimer. tous les anciens tests et risqueraient que le projet échoue en production.

Suivre ces instructions devrait vous aider à vous assurer que vos tests sont facilement réparables ou ne se cassent pas du tout lorsque votre base de code change.

3. Lorsque vous testez linterface utilisateur, écrivez les tests de manière à simuler le comportement réel de lutilisateur.

Supposons que vous testiez si ce bouton a été rendu et fonctionne comme prévu ou non, pensez dabord à la manière dont lutilisateur trouverait et interagirait avec ce bouton. Jespère quils verront le texte «Soumettre», puis appuieront dessus et cest exactement ce que nous simulerions. Dans notre cas de test, nous allons dabord rechercher le texte «Soumettre», puis simuler lévénement «onPress» dessus, puis affirmer tout ce qui était censé faire.

Dans certains cas, il se peut que ce ne soit pas le cas facile didentifier de manière unique le composant que vous souhaitez cibler, et dans ce cas, vous pouvez utiliser testID prop, mais noubliez pas que vous ne simulerez pas le comportement complet de lutilisateur si vous utilisez testID car les utilisateurs ne ciblent pas les composants en fonction de leur testID.

Pourquoi est-ce important? Pourquoi devons-nous essayer de simuler autant que possible le comportement des utilisateurs lors du test de linterface utilisateur? En effet, à la fin, ce sera un humain qui interagira avec votre interface utilisateur et non avec un ordinateur et s’ils voient un «Bonjour» safficher dans votre bouton plutôt qu’un «Soumettre», votre scénario de test devrait échouer car cest quelque chose qui peut décourager lutilisateur final.

4. Les fonctions pures sont plus faciles à tester que les fonctions impures

Les fonctions pures sont des fonctions qui donneront toujours la même sortie pour une entrée correspondante, cest-à-dire si une fonction pure pompe 2 pour un 1, il le ferait toujours alors que les fonctions impures pourraient être vidées 2 au premier appel, puis vidées 5 lors du deuxième appel.

Cest pratique à garder à lesprit lors de lécriture de code. Les fonctions impures peuvent devenir plus faciles à tester si le module qui introduit «limpureté» dans de telles fonctions est mockable.

5.Utilisez des fixtures comme entrée et assertions dans vos tests

Supposons que vous ayez un objet de type employee et que vous ayez diverses fonctions opérant sur eux, comme une fonction pour mettre en majuscule le name, une fonction pour vérifier si lemployé est un adulte ou non, etc.

Maintenant, supposons que vous preniez cet objet comme entrée dans tous vos cas de test.

Il sagit de vos données factices ou de votre «appareil». Dans votre premier cas de test qui teste si la fonction qui met en majuscule le nom fonctionne comme prévu ou non, vous affirmez que sa sortie est égale à { ...employee, name: employee.name.toUpperCase() } et dans votre deuxième cas de test, vous affirmez si la fonction produit employee.age >= 18 ou pas, et ainsi de suite.

Vous vous demandez peut-être quel avantage pouvons-nous obtenir en utilisant des appareils de cette manière? La réponse est que vous vous facilitez la tâche pour corriger rapidement les tests à lavenir en écrivant vos tests de cette façon.

Par exemple. Que faire si nous voulons ajouter une autre propriété maritalStatus dans lobjet employé, car maintenant tous nos employés sont tenus de divulguer leur état matrimonial. Si dans notre premier cas de test, nous affirmons que la sortie est égale à { name: "KARTIK", age: 25, sex: "Male", children: 0 } au lieu de { ...employee, name: employee.name.toUpperCase() }, notre scénario de test échouera. Cela se cassera également si nous changeons la valeur de name en autre chose. En dautres termes, notre scénario de test ne serait pas du tout flexible et aura donc plus de chances de se rompre en raison de changements non liés dans la base de code.

6. Ecrire des tests unitaires pour les composants et les fonctions utilitaires

Ce sont des parties de votre code qui vont être utilisées par plusieurs modules. Par conséquent, ils doivent être testés pour toutes les entrées / cas de bord possibles car vous ne savez pas comment les autres modules vont utiliser ces fonctions / composants. Par conséquent, ceux-ci ne devraient pas avoir de comportement inattendu.

7. Ecrire des tests dintégration pour les écrans

Il est difficile décrire des tests unitaires pour les écrans car ils dépendent généralement dun grand nombre de composants et dautres bibliothèques tierces comme un magasin redux. Donc, pour écrire des tests unitaires pour les écrans, vous devrez dabord vous moquer de toutes ces dépendances, ce qui représente beaucoup de travail. Cest pourquoi il est préférable décrire des tests dintégration dans ce cas.

7. Ecrire des tests E2E pour tester le code natif

Le code natif ne sexécute pas dans un environnement jest. Donc pour le tester, vous devrez utiliser une bibliothèque comme Detox.

8. Faites toujours des tests dinstantané pour les écrans et les composants

Si vous modifiez le style dun composant utilisé par plusieurs autres écrans / composants, les tests dinstantané pour ceux-ci échoueront jusquà ce que vous mettiez à jour les instantanés. Cela vous aidera à comprendre quels autres modules ont été affectés par le changement que vous avez effectué. Si vous travaillez en équipe, cela aide vraiment le réviseur lors des révisions PR à comprendre quels modules ont été affectés par la modification particulière que vous avez apportée au composant, car les changements dans les instantanés de ces modules sont reflétés dans votre PR.

Conclusion

Jespère que vous avez trouvé cet article utile et si vous êtes confus par ce que vous venez de lire, ne vous inquiétez pas. La deuxième partie de cette série sera un tutoriel sur la configuration de lenvironnement de test dans React Native avec des exemples de code décrans de test, de composants et de fonctions, en suivant les directives que nous avons définies dans cette première partie.

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *