Le monde JavaScript offre de nombreuses options pour … eh bien, à peu près tout. Aujourd’hui, nous allons nous concentrer sur les outils de test, en répondant à la question » Quel est le meilleur framework JavaScript ? «
Nous vous guiderons à travers cinq des frameworks de test JavaScript les plus populaires et, à la fin de l’article, nous élirons celui que nous pensons être le meilleur. Commençons.
- Qu’est-ce que les frameworks de test ?
- Cinq frameworks de test JavaScript qui valent la peine d’être vérifiés
- Mocha
- Puppeteer
- Jasmine
- QUnit
- Jest
- Absences notables
- Verdict : Quel est le meilleur framework de test JavaScript ?
- Évaluation des frameworks
- Coût
- Installation
- Facilité de configuration
- Courbe d’apprentissage
- Voici le gagnant
Qu’est-ce que les frameworks de test ?
Avant de nous plonger dans notre liste de frameworks, il est important de comprendre ce qu’est un framework de test.
Plus simplement, un framework de test est un outil – ou un ensemble d’outils – qui vous aide à effectuer des tests unitaires. Un framework de test doit vous fournir au moins
- Des règles ou des conventions pour écrire des cas de test et les organiser en suites de test.
- Des moyens pour exécuter automatiquement et auto-noter les tests.
- Résultats des tests qui sont affichés et formatés.
Cinq frameworks de test JavaScript qui valent la peine d’être vérifiés
À présent, vous devriez avoir une bonne maîtrise de ce que sont les frameworks de test et pourquoi nous en avons besoin. Cela étant fait, il est temps de s’attaquer à notre liste d’outils, en commençant par Mocha.
Mocha
Mocha, parfois aussi appelé MochaJS, est un framework de test qui fonctionne à la fois dans Node.js et dans le navigateur. Il a été publié en 2011 et depuis lors, il est l’un des cadres de test les plus populaires dans le monde du JavaScript. Cependant, selon le rapport State of JavaScript, la popularité de Mocha est en baisse depuis quelques années, même s’il reste sans doute le plus utilisé et le plus connu des outils.
Ce framework simplifie les tests asynchrones en exécutant les tests en série. Cela permet un reporting précis et, en même temps, la mise en correspondance des exceptions non attrapées avec les bons cas de test. Le framework Mocha a une configuration extrêmement flexible. Il vous permet de le coupler avec les bibliothèques dont vous avez particulièrement besoin pour des fonctionnalités telles que les assertions, le mocking, etc.
L’inconvénient d’une telle flexibilité est que Mocha nécessite plus de travail pour sa configuration initiale. De plus, alors que d’autres frameworks sont déjà livrés avec des assertions et des fonctionnalités de mocking, Mocha nécessite des outils supplémentaires pour cela.
Site officiel : mochajs.org
Repository : github.com/mochajs/mocha
Puppeteer
Puppeteer est une bibliothèque Node.js qui permet aux utilisateurs de contrôler un navigateur Chrome ou Chromium sans tête. De cette façon, il est possible d’automatiser des tests que vous effectueriez typiquement manuellement en utilisant un navigateur ordinaire. La page du projet énumère quelques exemples de tests que vous pouvez effectuer :
- Générer des captures d’écran et des PDF de pages.
- Crawler une SPA (application à page unique) et générer du contenu pré-rendu (c’est-à-dire « SSR » ).
- Automatiser la soumission de formulaires, les tests d’interface utilisateur, la saisie au clavier, etc.
- Créer un environnement de test automatisé et à jour. Exécutez vos tests directement dans la dernière version de Chrome en utilisant les dernières fonctionnalités JavaScript et du navigateur.
- Capturez une trace chronologique de votre site pour aider à diagnostiquer les problèmes de performance.
- Testez les extensions Chrome.
- Testim a publié un enregistreur gratuit pour Puppeteer. Vérifiez-le et utilisez-le aussi souvent que vous le souhaitez.
Site officiel : developers.google.com/web/tools/puppeteer
Dépôt : github.com/puppeteer
Jasmine
Jasmine est un cadre de test JavaScript BDD (behavior-driven development).
Ce cadre est déjà livré avec à peu près tout ce dont vous avez besoin pour commencer à tester. Il a des assertions intégrées et des doubles de test avec des espions, contrairement à, disons, Mocha, qui vous oblige à installer des outils tiers pour ces fonctionnalités.
Cependant, Jasmine est également flexible et peut s’intégrer de manière transparente avec un grand nombre d’outils de test supplémentaires. Vous pouvez facilement utiliser Karma comme exécutant de tests ou employer Sinon.JS pour vos besoins de mocking.
Site officiel : jasmine.github.io/
Repository : github.com/jasmine/jasmine
QUnit
QUnit faisait à l’origine partie de la bibliothèque de programmation jQuery. John Resig l’a créé pour tester jQuery, jQuery UI et jQuery Mobile. En 2008, QUnit a été extrait de la base de code de jQuery et publié en tant que framework autonome, mais il nécessitait toujours jQuery pour fonctionner. En 2009, ils ont corrigé cela avec une réécriture, rendant QUnit finalement indépendant de jQuery.
Malgré le fait qu’il ciblait à l’origine jQuery, QUnit est actuellement un framework générique qui peut tester n’importe quel code JavaScript, supportant à la fois les environnements côté client et côté serveur.
Vous pourriez penser à QUnit comme étant le représentant JavaScript dans la famille xUnit des frameworks de tests unitaires. Il a une configuration rapide et facile. De plus, comme il existe depuis au moins 12 ans, c’est un outil bien supporté.
Site officiel : qunitjs.com
Dépôt : github.com/qunitjs/qunit
Jest
Jest est un framework de test pour JavaScript qui se concentre sur la simplicité. Publié par Facebook, Jest vise à fonctionner dès la boîte et sans aucune configuration nécessaire.
Si vous jetez un coup d’œil à la page de « démarrage » de Jest, vous verrez que vous pouvez l’installer, écrire votre premier test et l’exécuter en quelques minutes, sans configurations compliquées ou installations supplémentaires. Un autre avantage de Jest est son impressionnante performance.
Jest est principalement utilisé pour tester les applications React, mais cela ne signifie pas que vous êtes limité à l’utiliser pour tester uniquement les applications écrites avec le framework. Au contraire : vous pouvez l’utiliser pour tester des applications Node, Angular et Vue également, pour n’en citer que quelques-unes.
Site officiel : jestjs.io/
Dépôt : github.com/facebook/jest
Absences notables
Vous vous demandez peut-être pourquoi certains outils de test JavaScript célèbres n’ont pas figuré dans notre liste. Vous pensez peut-être que des outils comme Karma, Sinon et Chai, entre autres, sont suffisamment populaires pour figurer dans la liste. Pourquoi ne les avons-nous pas inclus ?
Plus simplement, nous voulions garder la liste aussi concise que possible. Pour ce faire, nous avons décidé de ne pas inclure dans la liste les outils de test qui ne sont pas des frameworks, à proprement parler. C’est donc la raison pour laquelle un outil aussi populaire que Karma n’a pas été retenu : il s’agit d’un exécuteur de tests, pas d’un framework. Le même raisonnement s’applique à Sinon (un outil de mocking) et à Chai (une bibliothèque d’assertions).
Vous pourriez argumenter que Puppeteer n’a pas tout à fait sa place dans la liste et, dans une certaine mesure, je serais d’accord. C’est-à-dire que tous les autres outils sont des frameworks plus adaptés à la réalisation de tests de type tests unitaires, alors que Puppeteer est plutôt un outil d’automatisation de navigateur. Il s’agit tout de même d’un framework de test, dans le sens où il vous permet de concevoir des tests automatisés qui sont ensuite exécutés sans intervention humaine.
Verdict : Quel est le meilleur framework de test JavaScript ?
Nous avons présenté cinq frameworks de test pour JavaScript. Il est maintenant temps de tenir la promesse du titre du post et de sélectionner le meilleur. Pour ce faire, nous allons juger les frameworks selon quatre critères : le coût, l’installation, la facilité de mise en place et la courbe d’apprentissage.
Évaluation des frameworks
Coût
Le premier critère est certainement le plus facile à évaluer pour nous. Tous les frameworks que nous avons couverts ici sont des projets open-source, vous pouvez donc les télécharger et les utiliser gratuitement (comme dans la bière). Donc, nous n’avons pas de gagnant clair ici. Passons à autre chose.
Installation
L’installation de tous les outils ci-dessus est assez facile. Après tout, vous pouvez tous les installer en utilisant npm (ou, alternativement, Yarn.) Cependant, certains des outils offrent des options d’installation supplémentaires.
Par exemple, outre npm et Yarn, vous pouvez installer QUnit en tant que téléchargement autonome. Mais cela vous obligerait à stocker et à gérer cet actif. Au lieu de cela, vous pouvez utiliser la version hébergée sur le CDN de jQuery. Jasmine propose également une version autonome qui ne dépend pas de Node et vous permet d’exécuter des spécifications à l’aide de votre navigateur.
Alors, avons-nous un gagnant ici ? Nous pensons que oui. Si nous devions choisir en nous basant uniquement sur la facilité d’installation, nous aurions un autre tirage. Mais, comme nous l’avons vu, QUnit et Jasmine offrent tous deux plus d’options, puisque vous pouvez les utiliser comme des bibliothèques autonomes. Cette flexibilité supplémentaire est-elle utile ? Votre kilométrage peut varier à ce sujet, mais pour nous, QUnit et Jasmine sont les gagnants ici.
Gagnants : QUnit et Jasmine
Facilité de configuration
Maintenant, examinons la facilité de configuration. Quand il s’agit de la configuration initiale, nous avons un gagnant clair ici : Jest. Le framework promet une utilisation zéro-config et tient cette promesse. Bien sûr, il vous permet de faire des configurations optionnelles, mais il est incroyable d’installer un framework de test et d’avoir un vrai test en cours d’exécution en deux minutes environ, sans aucune configuration ou installation d’autres outils.
Gagnant : Jest
Courbe d’apprentissage
Enfin, la courbe d’apprentissage. Nous allons devoir choisir Jest à nouveau ici. Comme il est livré avec une large API et ne nécessite pas autant d’outils tiers que les autres frameworks, Jest présente inévitablement une courbe d’apprentissage moins abrupte.
Gagnant : Jest
Voici le gagnant
Après avoir couvert cinq frameworks de test JavaScript, puis les avoir analysés à l’aide de quatre critères, il est temps de choisir un gagnant.
Donc, puisqu’il était le gagnant dans deux des quatre critères que nous avons utilisés, nous allons choisir Jest comme notre gagnant. Cela ne signifie pas que vous ne devez pas essayer les autres outils. Au contraire : expérimentez et pratiquez autant que vous le pouvez car c’est la meilleure façon d’apprendre.