les tests Runner d’Angular JS Sommaire Introduction Les types d’AngularJS Les tests unitaires (Unit testing) : 2- Test Midway (Midway Testing) Test d’intégration (E2E testing): . rapport de stage pfe Premium gy Mostapha-Rachid aorycTa 18, 2014 g pages Étude comparative sur les Frameworks de test et 3 org su Sni* to View Scenario Runner (+karma) Protractor Critères du choix de la solution technique: Le lanceur de test « Test Runner 2 Le Framework de test : . Les tests d’intégrations ils se sont assuré que le code écrit à l’aide AngularJS est facile ? tester (Filters, directives, controllers… ). En plus AngularJS vient avec son propre Framework de test (Proctractor) et la façon dont il a été conçu permet de tester facilement la logique de la présentation indépendamment de la vue. Les types d’AngularJS tests : Ecrire des tests tout en développant des applications peut vous faire économiser beaucoup de temps que vous auriez autrement gaspillé dans la correction des bugs inattendus.
Pour cela AngularJS met à la disposition de développeurs trois types de tests 1- Les tests unitaires (Unit testing) : Les tests unitaires sont une technique qui aide les développeurs ? valider des pièces isolées de code, n segmentant l’application en petits morceaux ou ‘unité’ afin de vérifier que chaque unité fonctionne comme vous le souhaitez. Dans le cas des applications JavaScript, les plus petites unités de code, vous pouvez tester sont généralement des fonctions. – Test Midway (Midway Testing) Lorsque vous voulez tester une opération au niveau de l’application (comme le chargement d’une page ou un XHR request) avec des tests unitaires, cela exige l’utilisation des interceptors et mocks et fake données qui se traduisent par plus de code et plus de complexité pour les tests, et même les tests d’intégration ne résout pas ar ils représentent un l’accès à n’importe qu’il niveaux du code JavaScript. – Test d’intégration (E2E testing) • Les tests d’intégration entre en jeu lorsqu’on veut s’assurer et vérifier qu’un ensemble de composants, lorsqu’elles sont intégrées, fonctionne comme prévu. L’ensemble de l’application est testée dans un scénario réel tel que la communication avec la base de données, réseau, matériel et autres applications. Par exemple, un test simplifié de bout en bout d’une application de messagerie peut impliquer: Connexion à l’application Accès à la boîte de réception
Ouverture et fermeture de la boîte aux lettres Rédaction, du transfert ou de la réponse à un courriel Vérification des envois Déconnexion de l’application Les Framework de test JavaScript • Tester n’est pas une pratique commune dans le développement front-end, mais les applications web ont devenus de plus en plus complexe Alors Google a créé des outils pour tester ses propres applications web. Grace à Misko Hervery est les autres membres de l’équipe AngularJS, Google a rendu ces outils open source et disponible pour tout le monde.
Ces outils ont essentiellement fournis : les browsers, DOM et les autres JavaScript Framework non plus, donc il est adapté pour les sites web, les projets nodesJS ainsi que tout plateforme supportant JavaScript Sa syntaxe est basée sur RSpec qui est utilisé pour les tests dans des projets Rails. il a aussi des support intégré pour des espions(Spies) vers les fonctions et ses arguments. 2- Qunit : Qunit a été développé par John Resig comme partie de jQuery.
C’est l’un des Framework de test unitaire le plus simple, il est utilisé par jQuery et capable de tester n’importe qu’il code JavaScript. Qunit est compatible avec et Opera. tous browsers supporter par jQuery que 3- Mocha : n programme en l’gne de commande pour tester votre suite à l’appel. Comme vous pouvez le voir, c’est trop de douleur et le temps et d’efforts pour le mettre en place doit être gardé pour des choses plus importantes, comme la construction de votre application. – Karma (Spectacular Test Runner for JavaScript. ) Karma est un lanceur de test « test Runner » créé par l’équipe d’AngularJS pour répondre a leurs besoins. son objectif principal est d’apporter un environnement de test de production pour les développeurs. Karma permet de Testez l’application sur des vrais navigateurs et des périphériques éels tels que les téléphones, les tablettes ou même sur une instance de PhantomJS. Contrôler l’ensemble du flux de travail à partir de la igne de commande ou votre IDE. ancer n’importe qu’Il Framework de test (Jasmne, Mocha, Qunit… ). Simplifier l’intégration continue avec Jenkins, ravis ou Semaphore. Rendre facile le débogage directement depuis l’IDE via WebStrom ou Google Chrome. 2- JS-Test-Driver JSTD est l’un des Framework de test unitaire les plus puissants et efficaces dans le monde de JavaScrlpt ainsi qu’il représente un lanceur de test « test Runner » complète qui peut exécuter même ‘autres Framework de test unitaire (Jasmine, Mocha, Qunit … J.
JSTD fournit une syntaxe simple pour créer des cas de test JavaScript qui peut fonctionner soit à artir du navigateur ou de la lign de, il fournit aussi un dans des vrais navigateurs. Il exécute automatiquement les actions (de remplissage des formulaires, clique sur les boutons et les liens et vérifie les réponses de l’interface utilisateur (de changement de page, propres l’information affichée, et ainsi de suite), ce qui réduit considérablement la nécessité pour les vérifications manuelles traditionnellement ffectuées par les équipes d’assurance qualité.
Scenario Runner est une solution très similaire à d’autres outils existants (par exemple Sélénium), mais elle s’intégrée étroitement avec le Framework, Plus précisément elle est au courant des événements asynchrones (surtout XHR appelle), ce Framework peut interrompre l’exécution d’un essai jusqu’à ce que l’événement asynchrone termine sans utilisé des instructions d’attente. Scenario Runner utilise Karma pour exécuter les tests. 4- protractar Protractor est la nouvelle approche d’AngularJS pour les tests d’intégrations (E2E testing) basée sur Selinium WebDriverJS.
Il exécute les tests sur des vrais navigateurs et n’exige pas l’utilisation de Karma. Protractor est conçu pour AngularJS, mais pas limité a cela, il est capable d’exécuter tout les tests JavaScript écrient par les différents Framework Oasmine, Mocha ou Qunit… ). Critères du choix de la solution technique: Dans notre étude on va commencer par choisir le lanceur de test le plus adapté au développement d’une application AngularJS afin de ouvoir par la suite choisir le Framework de test. ‘écrire leur propre lanceur de test Karma (testacular). Pourquoi karma est considéré comme un lanceur de test idéal : Un lanceur de test doit être rapide : L’expérience indique que si l’exécution des tests est lente, les gens niecrivent pas les tests. Karma vient pour palier a ce problème et il a permet d’obtenir une rétroaction (feedback) instantanée afin d’être plus productif et créatif Alors les tests deviennent un atout plutôt qu’un désagrément. n lanceur de test doit utiliser un vari navigateur : L’exécution des tests sur les navigateurs réels est indispensable car AngularJS fait beaucoup de manipulation du DOM, et nous avons besoin d’être sûr que cela fonctionne sur tous les navigateurs. En plus Karma communique avec ces navigateurs avec des protocoles communs (http, websocket… ) cela a permet non seulement tester sur les navigateurs de bureau, mais aussi sur d’autres appareils tels que les téléphones mobiles et les tablettes.
Par exemple, l’équipe YouTube utilise Testacular(Karma) pour exécuter l’intégration continue sur PlayStation 3. un lanceur de test doit être stable et fiable : Etre rapide et offrir la possibilité d’exécuter les tests sur un vrai navigateur ou touts autres équipements n’est plus un souci our les développeurs parce qu’il y a pas mal de lanceurs de écupérer avec élégance d’autres problèmes, comme les erreurs de syntaxe dans le code sous test. – Le Framework de test : Jasmine, Qunit et Mocha sont très semblable en termes des fonctionnalités offertes, mais pourtant ils représentent quelque différance concernant la simplicité d’utilisation et leur degré de maturité, le tableau suivant montre une étude comparative entre les différents Framework : Génération des rapports Jasmine Qunit Mocha Compatibilité avec les lanceurs de test Degré de maturité La simplicité d’installation configuration compatibilité avec AngularJS