ESSAI
Se moquer des requêtes réseau encore plus facilement
De nos jours, il est nécessaire de modifier une bibliothèque plus ancienne pour TS
et effectuer des checks unitaires. Si la bibliothèque est modifiée pour TS
, il y a encore un peu mieux. Les checks unitaires sont purement une étude actuelle et vendus maintenant. Pour que les débutants apprennent le Jest
framework, je pense que la selected la plus gênante dans les checks unitaires est de tester les requêtes réseau. Enregistrez donc certaines des façons dont Mock
abandonné Axios
pour initier des requêtes réseau. Ceci est mon 39e article sur Medium.
Les exemples mentionnés dans l’article sont tous dans le jest-mock-serveur dépôt. Vous pouvez démarrer l’exemple directement en installant le gestionnaire de packages, par exemple, en installant through yarn
:
$ yarn set up
Certaines commandes sont spécifiées dans le bundle.json
qui sont les suivants :
npm run construct
: La commande d’emballage derollup
.npm run check:demo1
: Simplementmock
la bibliothèque de requêtes réseau encapsulée.npm run check:demo2
: Complétez lemock
en réimplémentanthook
.npm run check:demo3
: Utilisez la bibliothèque dansJest
pour achever la mise en œuvre dedemo2
.npm run check:demo4-5
: Commencer unnode
serveur,proxy
la requête réseau through le proxy deaxios
et transférez-le au démarragenode
serveur. En définissant les données de demande et de réponse de check unitaire correspondantes, la relation correspondante est utilisée pour réaliser le check, qui estjest-mock-server
travail terminé.
Ici, nous encapsulons une couche de axios
, qui est plus proche de la scène réelle. Vous pouvez visualiser le check/demo/wrap-request.ts
déposer. En fait, cela crée simplement une axios
occasion en interne et transmet les données de réponse.
Le check/demo/index.ts
fichier exporte simplement un counter
méthode, où ces deux paramètres sont traités dans une certaine mesure avant que la requête réseau ne soit initiée. Ensuite, les données de réponse sont également traitées dans une certaine mesure, juste pour simuler des opérations connexes.
Ici Jest
utilise l’environnement du navigateur simulé par JSDOM
le fichier de démarrage check/config/setup.js
est configuré dans le setupFiles
attribut configuré dans jest.config.js
et JSDOM
est initialisé ici.
Easy mock
le traitement est effectué dans check/demo1.check.js
et vous pouvez essayer de l’exécuter through npm run check:demo1
. En fait, un mock
l’opération s’effectue sur le wrap-request
bibliothèque qui enveloppe axios
. wrap-request
sera compilé lorsque Jest
a démarré. Une fois la bibliothèque simulée ici, tous les fichiers importés dans la bibliothèque par la suite recevront les objets simulés. En d’autres termes, on peut penser que cette bibliothèque a été réécrite, et les méthodes après réécriture sont toutes JEST
c’est Mock Features
. Vous pouvez utiliser des fonctions telles que mockReturnValue
pour la simulation de données. Pour Mock Features
veuillez vous référer à ceci lien.
Ici, nous avons terminé la Mock
de la valeur de retour, ce qui signifie que nous pouvons contrôler la valeur renvoyée par le request
dans le wrap-request
bibliothèque. Cependant, il a été mentionné précédemment qu’il existe également certains processus pour les paramètres entrants. Nous n’avons fait aucune affirmation sur cette partie du contenu, nous devons donc également essayer de gérer cela.
demo2
peut être tenté de traverser npm run check:demo2
. Comme mentionné ci-dessus, nous pouvons gérer la valeur de retour, mais il n’y a aucun moyen d’affirmer si les paramètres d’entrée sont traités correctement, nous devons donc gérer cette state of affairs. Heureusement, Jest
fournit un moyen d’implémenter directement la bibliothèque de fonctions qui est simulée. Donc, Jest
fournit également une mockImplementation
méthode, qui est utilisée dans demo3
. Ici, nous avons réécrit la bibliothèque de fonctions fictives. Nous pouvons également utiliser jest.fn
compléter Implementations
. Ici nous écrivons un hook
fonction avant de retourner puis implémenter des assertions ou spécifier des valeurs de retour dans chacune check
. De cette façon, le problème ci-dessus peut être résolu, qui est en fait la réalisation de mockImplementation
de Mock Features
dans Jest
.
demo3
peut être tenté de traverser npm run check:demo3
. L’exemple dans demo2
est en fait compliqué à écrire. Dans Jest
, Mock Features
a la mise en œuvre de mockImplementation
qui peut être utilisé directement.
demo4
et demo5
peut être tenté de traverser npm run check:demo4–5
. De cette façon, une vraie demande de données est faite. Ici, axios
proxy sera utilisé pour transmettre les demandes de données internes au port de serveur spécifié. Par conséquent, le serveur est également démarré localement et le check est effectué en spécifiant les données de requête et de réponse liées au correspondant path
. Si les données demandées sont incorrectes, les données de réponse associées ne seront pas mises en correspondance normalement. Par conséquent, la requête renverra directement 500
. Si les données de réponse renvoyées sont incorrectes, elles seront également capturées lors de l’assertion. Dans le jest-mock-server
bibliothèque, nous devons d’abord spécifier trois fichiers qui correspondent aux trois cycles de vie que chaque fichier de check unitaire doit être exécuté avant le démarrage. Jest
le check est exécuté avant les trois cycles de vie et les trois cycles de vie sont exécutés après le Jest
l’essai est terminé. Les trois fichiers que nous devons spécifier sont les setupFiles
, globalSetup
et globalTeardown
éléments de configuration du jest.config.js
fichier de configuration.
Nous allons d’abord commencer par setupFiles
. En plus d’initialiser JSDOM
nous devons également utiliser le proxy par défaut de axios
. Parce que la answer retenue est d’utiliser le proxy
de axios
pour transmettre les demandes de données. Par conséquent, il est nécessaire de définir la valeur proxy au premier plan du check unitaire.
Une fois que nous avons configuré le fichier ci-dessus dans lecheck/config
file, nous devons y ajouter deux autres fichiers qui sont globalSetup
et globalTeardown
. Ces deux fichiers font référence aux opérations effectuées avant la Jest
le check unitaire démarre et une fois tous les checks terminés. Nous plaçons les opérations de démarrage et d’arrêt du serveur dans ces deux fichiers.
Veuillez noter que le fichier en cours d’exécution dans ces deux fichiers est un fichier indépendant distinct
contex
qui n’a rien à voir avec lacontex
de tout check unitaire, y compris le fichier spécifié par l’élément de configuration setupFiles. Par conséquent, toutes les données ici sont soit spécifiées dans le fichier de configuration, soit elles doivent être transmises entre les ports du serveur through le réseau.
Pour les informations de port de configuration et de nom de domaine, placez-les directement dans le globals
champ dans jest.config.js
. Pour le debug
élément de configuration, il est recommandé de l’utiliser conjointement avec check.solely
.
Maintenant, il peut y avoir des strategies sur la raison pour laquelle le serveur ne doit pas être démarré et arrêté dans le beforeAll
et afterAll
cycles de vie de chaque fichier de check unitaire. J’ai donc essayé cette answer. Dans cette answer, pour chaque fichier de check, le serveur est démarré puis arrêté. Cette answer est donc relativement chronophage. Mais en théorie, cette answer est raisonnable. Après tout, il est vrai que l’isolation des données est nécessaire. Mais il y a un problème quand afterAll
est fermé. Il ne ferme pas réellement l’occupation du serveur et du port automobile le shut
méthode est appelée lorsque la node
le serveur est fermé. QuandafterAll
est fermé, il vient d’arrêter de traiter la requête mais le port est toujours occupé. Lorsque le deuxième fichier de check unitaire est démarré, une exception sera levée indiquant que le port est utilisé. Bien que j’aie essayé quelques options, elles ne sont pas idéales automobile parfois le port est encore occupé. Surtout quand le node
est exécuté pour la première fois après sa mise sous rigidity, la probabilité d’anomalie est relativement élevée. Par conséquent, l’effet n’est pas très satisfaisant. En fin de compte, le schéma d’isolement complet est adopté. Pour des questions connexes spécifiques, veuillez vous référer à ce lien.
Puisque nous adoptons une answer complètement isolée, il n’y a que deux choices lorsque nous voulons transmettre les données de requête et de réponse pour la requête de check. Les deux options sont soit au démarrage du serveur toutes les données sont spécifiées dans le check/config/global-setup.js
fichier ou les données sont transmises through le réseau lorsque le serveur est en cours d’exécution, le chemin est spécifié et la demande réseau du chemin transportera des données et la demande de données sera spécifiée dans la fermeture du serveur. Par conséquent, les deux choices sont prises en cost ici. Je pense qu’il est plus approprié de spécifier vos propres données dans chaque fichier de check unitaire, donc voici un seul exemple de spécification des données à tester dans le fichier de check unitaire. En ce qui concerne les données à tester, un DataMapper
kind est spécifié pour réduire les exceptions causées par des erreurs de kind. Par conséquent, deux ensembles de données sont illustrés ici. De plus, les expressions régulières sont prises en cost lors de la correspondance question
et knowledge
. La structuration de la DataMapper
le kind est relativement customary.
Dans les deux checks unitaires ci-dessous, les données à tester sont spécifiées dans beforeAll
. Noter que beforeAll
est de retour setSuitesData(knowledge) automobile le check unitaire est exécuté après la définition des données et la réponse est réussie, suivie de la requête normale et de la réponse indiquant si le check d’assertion est right.