Tester jquery avec jest dans le développement WordPress

Je me demande juste si mes mises à jour () enverront un rappel: Maintenant, regardons le test. Je n’ai même pas l’intention de lui envoyer de faux messages maintenant, juste un tableau de trois éléments et puis prétendre que mon rappel a été appelé trois fois:
La ligne clé ici est la ligne 4. Dans cette ligne, j’a i utilisé jest pour créer une fonction appelée Callback. FN (). Par conséquent, je peux utiliser un rappel pour calculer le nombre de fois que je l’appelle. Simulation. Téléphone. Long Ceci vérifiera que ma fonction a été appelée le bon nombre de fois. Cela ne signifie pas que vous obtenez les bonnes données. Pour ce faire, nous pouvons utiliser une fonction utilitaire appelée jest avec. FN (): le premier obstacle majeur à l’adoption de tests dans les bibliothèques de code héritées est que le Code peut ne pas être facile à tester. L’isolement peut ne pas être testé. Vous pouvez encore écrire des tests Dom en utilisant des cadres d’automatisation de navigateur comme Cypress. Je suis toujours quelque chose. Vous pouvez également utiliser des outils comme la Bibliothèque de test Dom pour tester Dom.
Mais un simple remaniement peut isoler la logique opérationnelle du système d’événements Dom. Voici un exemple de jquery utilisé pour associer un événement de clic, puis ajouter ou supprimer des classes en fonction d’une condition: Vous pouvez rendre tout ou partie du Dom, simuler le clic, puis vérifier que l’élément Dom a la classe correcte. C’est lent, et c’est la responsabilité de jquery de tester beaucoup de choses, pas votre code. Votre logique d’entreprise est votre entreprise, pas les associations jquery et les systèmes d’envoi d’événements. Le fragment de code que j’ai montré ci – dessus fait beaucoup de choses, en violation du principe de la responsabilité individuelle. Divisons – le en deux fonctions. La fonction accepte jquery comme dépendance, puis exécute la logique d’entreprise. Le rôle d’une autre fonction est de connecter la logique d’isolement encapsulée dans la première fonction au système d’événements
Jquery.
Voyons maintenant comment tester cette fonctionnalité avec notre logique d’entreprise. Puisque nous passons jquery comme une dépendance de fonction, vous pouvez passer n’importe quelle fonction là – Bas. Comme une blague. Comme nous ne testons pas l’effet de ces fonctions en ajoutant et en supprimant des classes des éléments Dom corrects, nous devons juste savoir que les fonctions sont appelées. La simulation de base que j’ai montrée précédemment n’est pas suffisante pour ce test. Je dis ça pour deux raisons. Tout d’abord, il n’a pas de constructeur, donc appeler le constructeur jquery (nous n’avons pas vraiment testé) génère une erreur. Deuxièmement, nous devons être en mesure de compter les appels à différentes méthodes.
Les tests suivants ont résolu le premier problème, mais pas le deuxième: Cela se fera par un générateur approprié. Mais ce que nous savons, c’est que deux méthodes de cet objet sont appelées. Lequel? Nous ne savons pas, c’est important parce que dans nos tests, nous devons nous assurer qu’il s’appelle removeclass, pas addclass. C’est la logique d’entreprise que nous testons. La solution est de mettre ces méthodes dans leurs variables, et nous pouvons vérifier: Maintenant, Nous testons si la logique d’entreprise conduit à appeler les bonnes fonctions. Nous ne testons pas les effets, mais notre logique. Mission accomplie.
Quelle est la pertinence des activités? Je n’ai aucun lien avec les événements réels. Je m’en fous. Pourquoi? Tout d’abord, j’ai de sérieux doutes que j’y rencontrerai des problèmes. S’il y en a, ce sera un gros problème avec les tests d’acceptation et d’intégration qui fonctionnent sur des sites Web réels et simulent l’interaction utilisateur. Si jquery ne fonctionne pas correctement, ces tests seront difficiles à échouer, ce qui me donne plus de confiance dans la liaison d’événements que n’importe quel événement simulé que j’ai créé pour les tests. Si la logique de l’entreprise est testée, ça ira.
Testez tout avec jest imp testez jquery ajax
Obtenez jquery. Ajax () a quelques raisons: il est intégré dans le navigateur, fonctionne de la même manière sur le serveur, et a une bibliothèque de simulation très utile. J’ai écrit ici sur la façon d’écrire des tests d’Unit é pour l’API Fetch. Dans cet article, j’ai beaucoup parlé du ridicule de jest. Si vous souhaitez en savoir plus sur jest mocks, je vous recommande cet article. Mon but de test JavaScript est d’utiliser plusieurs couches supplémentaires dont j’ai besoin sur jest. Si je devais juste le tester en plaisantant. Cela peut aller trop loin, reconstruire le Code ou écrire trop de simulations, qui doivent ensuite être modifiées pour correspondre aux changements dans le Code, éliminant ainsi la nécessité de tester. Il s’agit d’un point d’équilibre difficile à trouver, très différent de l’écriture d’un test PHP, dans lequel vous n’avez qu’à décrire l’API de base de données ou l’API rest ou les classes qui traitent de la logique d’entreprise, tant qu’elles ne sont pas liées, vous pouvez effectuer des tests D’Unit é indépendants et des tests d’intégration couvrant la façon dont certaines classes se connectent. L’interface utilisateur de test (ce que nous traitons dans les applications qui n’utilisent que JavaScript dans le navigateur) est plus complexe. L’interface utilisateur est l’endroit où toutes les parties sont combinées, de sorte que les tests unitaires autonomes peuvent facilement limiter, plutôt que d’accélérer, la vitesse du Code.