Comment automatiser les tests E2E et unitaires avec Yeoman & AngularJS?

Question

Je suis en utilisant Yeoman et générateur-angulaire pour gérer les applications AngularJS, mais je vais avoir des ennuis avec des tests automatisés.

L'exécution grunt test va exécuter des tests unitaires fois. Je peux obtenir E2E les tests à exécuter, après que les tests unitaires en modifiant le karma config bloc en Gruntfile.js, en ajoutant e2e:

karma: {
  //...
  e2e: {
    configFile: 'karma-e2e.conf.js',
    singleRun: true
  }
},

Grand: maintenant quand je tape grunt test tous les tests sont exécutés. Mais ils ne s'exécute qu'une fois, et il y a une grosse surcharge (à partir de la boussole, l'exécution du serveur, le lancement de google Chrome, etc.). Au lieu de cela, le serveur et le Chrome processus doit rester en cours d'exécution et, lorsque j'enregistre un test, les tests doivent être ré-exécuter.

Je peux réaliser ceci en modifiant à la fois karma.conf.js et karma-e2e.conf.js et réglage de l' singleRun = true, puis en exécutant karma start dans un terminal volet, et karma start karma-e2e.conf.js dans un autre. Fourni aucun des ports dans le karma configs conflit (qui ils le font par défaut), cela fonctionne. Maintenant, je suis en contournant Grunt et juste faire mon propre truc (ce qui semble un peu ridicule, comme Grunt est censé rendre les choses plus facile).

De toute façon, après un peu plus de modifications (corrections?) - pas détaillé pour des raisons de concision - cela fonctionne, mais ne coupe pas: j'ai maintenant pour exécuter les deux commandes distinctes et garder un œil sur les deux terminaux différents volets. Il y a certainement une meilleure façon.

Comment puis-je exécuter une seule commande pour regarder mon test de fichiers et ré-exécuter les tests de manière appropriée?

Question Bonus: pourquoi sur la Terre, cette fonctionnalité est pas prévu que c'est? Est-ce juste une question de le développeur(s) du générateur-angulaire de ne pas avoir assez de temps pour mettre en œuvre ce genre de choses? Je demande parce que je viens juste d'arriver dans Angulaire/Yeoman/Karma (comme vous l'avez probablement remarqué), et le sentiment que les tests automatisés de deux E2E et les tests unitaires sont cruciales pour les flux de travail.

Answer 1

Comme je l'ai mentionné dans un commentaire à votre question - PhantomJS permet d'économiser beaucoup de tracas. Cela mis à part, je crois que vous pouvez tout gérer à partir de votre Gruntfile et tout simplement continuer à exécuter grunt test pour démarrer le tout.

grunt-karma permet une personnalisation complète de votre karma options avec un peu de pratique add-ons.

À partir de la documentation:

....

Vous pouvez remplacer tous les fichiers de configuration des paramètres directement:

karma: {   
  unit: {
    configFile: 'karma.conf.js',
    runnerPort: 9999,
    singleRun: true,
    browsers: ['PhantomJS']   
  }
}

---

Le Partage Des Configs

Si vous avez plusieurs objectifs, il peut être utile de partager les communes configuration des paramètres entre eux. Grunt-le karma prend en charge ce par à l'aide de la propriété options:

karma: {
  options: {
    configFile: 'karma.conf.js',
    runnerPort: 9999,
    browsers: ['Chrome', 'Firefox']
  },
  continuous: {
    singleRun: true
    browsers: ['PhantomJS']
  },
  dev: {
    reporters: 'dots'
  }
}

En outre vous pouvez découvrir dans Yeoman du générateur-angulaire Gruntfile code pour voir ce qui peut être disponible ou au moins mockable.

Answer 2

Vous pouvez essayer ceci pour exécuter uniquement des tests e2e

 grunt karma:e2e
 

Answer 3

Dans le fichier karma.conf.js (ligne approximative: 38), recherchez autoWatch = false; et changez-le en vrai.

Maintenant, si vous exécutez grunt karma: unit, vous constaterez que le serveur de test reste en marche et que toute modification apportée aux fichiers du projet relance immédiatement les tests.

Answer 4

//
// test/midway/appSpec.js
//
describe("Midway: Testing Modules", function() {
  describe("App Module:", function() {

    var module;
    before(function() {
      module = angular.module("App");
    });

    it("should be registered", function() {
      expect(module).not.to.equal(null);
    });

    describe("Dependencies:", function() {

      var deps;
      var hasModule = function(m) {
        return deps.indexOf(m) >= 0;
      };
      before(function() {
        deps = module.value('appName').requires;
      });

      //you can also test the module's dependencies
      it("should have App.Controllers as a dependency", function() {
        expect(hasModule('App.Controllers')).to.equal(true);
      });

      it("should have App.Directives as a dependency", function() {
        expect(hasModule('App.Directives')).to.equal(true);
      });

      it("should have App.Filters as a dependency", function() {
        expect(hasModule('App.Filters')).to.equal(true);
      });

      it("should have App.Routes as a dependency", function() {
        expect(hasModule('App.Routes')).to.equal(true);
      });

      it("should have App.Services as a dependency", function() {
        expect(hasModule('App.Services')).to.equal(true);
      });
    });
  });
});