1. Qu'est-ce que Qunit
Qunit (http://qunitjs.com/) est un cadre de test unitaire JavaScript très puissant qui peut vous aider à déboguer votre code. Il a été écrit par des membres de l'équipe JQuery et est un test officiel pour jQuery. Mais Qunit est généralement suffisant pour tester n'importe quel code JavaScript régulier, il peut même tester JavaScript côté serveur via des moteurs JavaScript tels que Rhino ou V8.
Si vous n'êtes pas familier avec le concept de «test unitaire», ne vous inquiétez pas. Ce n'est pas très difficile à comprendre:
La copie de code est la suivante:
Dans la programmation informatique, les tests unitaires (également appelés tests de modules) sont un test qui effectue des tests d'exactitude sur les modules de programme (la plus petite unité de conception de logiciels). L'unité de programme est le plus petit composant testable de l'application. Dans la programmation procédurale, une unité est un programme, une fonction, une procédure, etc.; Pour la programmation orientée objet, la plus petite unité est une méthode, y compris des méthodes dans les classes de base (superclasses), des classes abstraites ou des classes dérivées (sous-classes). - cité de Wikipedia.
Autrement dit, vous écrivez des tests pour chaque fonctionnalité de votre code, et si tous ces tests passent, vous pouvez être sûr que le code n'est pas défectueux (généralement, cela dépend de la façon dont votre test est approfondi).
2. Pourquoi voulez-vous tester votre code
Si vous n'avez jamais écrit de tests unitaires auparavant, vous pouvez directement télécharger votre code sur le site Web, cliquez pendant un certain temps pour voir si des problèmes surviennent et essayez de résoudre les problèmes que vous avez trouvés. Il y aura de nombreux problèmes avec cette méthode.
Tout d'abord, c'est très ennuyeux. Cliquer n'est pas en fait un travail facile, car vous devez vous assurer que tout est cliqué et qu'il y a de fortes chances que vous en mangiez un ou deux.
Deuxièmement, tout ce que vous faites pour les tests n'est pas réutilisable, ce qui signifie qu'il est difficile à régresser. Qu'est-ce que le retour? Imaginez que vous avez écrit du code et l'avez testé, corrigez tous les défauts que vous avez trouvés, puis postez-le. À ce stade, un utilisateur envoie des commentaires sur les nouveaux défauts et nécessite de nouvelles fonctionnalités. Vous revenez au code, corrigez ces nouveaux défauts et ajoutez de nouvelles fonctionnalités. Ce qui peut arriver ensuite, c'est que certains anciens défauts réapparaissent, qui s'appelle "retour". Regardez, maintenant vous devez cliquer à nouveau, et il est possible que vous ne puissiez pas trouver ces anciens défauts de fardeau; Même si vous le faites, il faudra un certain temps pour comprendre que votre problème est causé par la régression. À l'aide de tests unitaires, vous écrivez des tests pour trouver des défauts, et une fois le code modifié, vous filtrez à nouveau le test. Si la régression se produit, certains tests échoueront certainement et vous pouvez facilement les reconnaître et savoir quelle partie du code contient l'erreur. Maintenant que vous savez ce que vous avez modifié tout à l'heure, il peut être facilement résolu.
Un autre avantage des tests unitaires, en particulier pour le développement Web: il facilite la compatibilité des navigateurs. Exécutez simplement vos cas de test dans différents navigateurs. S'il y a un problème avec un navigateur, vous le corrigez et réécoutez ces cas de test pour vous assurer qu'il n'y a pas de régression dans d'autres navigateurs. Une fois qu'ils passent tous le test, vous pouvez dire avec certitude que tous les navigateurs cibles le soutiennent.
Je souhaite mentionner un projet de John Resig: TestSwarm (http://testswarm.com/). Il faut des tests unitaires JavaScript à un nouveau niveau, en le distribuant, il s'agit d'un site Web qui contient de nombreux cas de test que n'importe qui peut y aller pour exécuter certains cas de test, puis renvoyer les résultats sur le serveur. De cette façon, le code sera testé très rapidement sur différents navigateurs, ou même s'exécutera sur différentes plates-formes.
3. Comment rédiger des tests unitaires avec Qunit
Alors, comment écrivez-vous correctement les tests unitaires avec QUnit? Tout d'abord, vous devez configurer un environnement de test:
La copie de code est la suivante:
<! Doctype html>
<html>
<adal>
<Title> Qunit Test Suite </TITME>
<link rel = "Stylesheet" href = "http://github.com/jquery/qunit/raw/master/qunit/quunit/qunit.css" type = "text / css" media = "écran">
<script type = "text / javascript" src = "http://github.com/jquery/qunit/raw/master/qunit/quunit/qunit.js"> </ script>
<! - Votre fichier de projet va ici ->
<script type = "text / javascript" src = "myproject.js"> </ script>
<! - Votre fichier de tests va ici ->
<script type = "text / javascript" src = "mytests.js"> </ script>
</ head>
<body>
<h1 id = "Qunit-header"> QUnit Test Suite </H1>
<h2 id = "Qunit-Banner"> </h2>
<div id = "QUnit-Testrunner-Toolbar"> </div>
<h2 id = "Qunit-useragent"> </h2>
<ol id = "QUnit-tests"> </l>
</docy>
</html>
Comme vous pouvez le voir, une version de framework QUnit gérée est utilisée ici.
Le code à tester a été ajouté à myproject.js, et votre test doit être inséré dans mytest.js. Pour exécuter ces tests, ouvrez simplement le fichier HTML dans un navigateur. Il est maintenant temps d'écrire quelques tests.
La pierre angulaire des tests unitaires est l'affirmation:
L'affirmation est une proposition qui prédit le résultat de retour de votre code. Si la prédiction est fausse et que l'affirmation échoue, vous savez que quelque chose ne va pas.
Faites des affirmations et vous devez les mettre dans le cas de test:
La copie de code est la suivante:
// testons cette fonction
fonction iseven (val) {
Retour Val% 2 === 0;
}
test ('iseven ()', function () {
ok (iseven (0), 'zéro est un nombre uniforme');
ok (iseven (2), «aussi deux»);
ok (iseven (-4), «il est ainsi négatif quatre»);
ok (! Iseven (1), «on n'est pas un nombre pair»);
Ok (! Iseven (-7), «Ni l'un ni l'autre ne sont négatifs»);
})
Ici, nous définissons une fonction: Iseven, qui est utilisée pour détecter si un nombre est un nombre impair, et nous voulons tester cette fonction pour confirmer qu'elle ne renverra pas la mauvaise réponse.
Nous appelons d'abord Test (), qui construit un cas de test; Le premier paramètre est une chaîne à afficher dans le résultat, et le deuxième paramètre est une fonction de rappel qui inclut notre maître interrompu.
Nous avons écrit 5 affirmations, qui sont toutes booléennes. Une affirmation booléenne qui s'attend à ce que son premier argument soit vrai. Le deuxième paramètre est toujours le message à afficher dans le résultat.
Voici ce que vous voulez obtenir, tant que vous exécutez le test:
4. Référence d'apprentissage approfondie
Ce qui précède n'introduit que brièvement QUnit.js, et il existe de nombreuses méthodes d'assertion. Pour plus de détails, veuillez consulter la documentation de l'API:
http://api.qunitjs.com/
Les tests unitaires sont un très bon moyen de tester votre code avant de le publier. Si vous n'avez pas écrit de tests unitaires auparavant, il est maintenant temps de commencer!