Comment tester l'application angulaire avec John Papa style, Karma et Jasmine avec un service de données?

Pour une raison quelconque, même après l'exemple fourni par Josh dans la réponse post Comment tester les tests de John papa vm.model avec du jasmin? , Je ne peux pas afficher les valeurs de mon contrôleur dans la zone de test. Je pense que c'est à cause du service de données, mais c'est un élément nécessaire à notre SPA, tout comme le style de John Papa .

Voici un extrait de code pour contenir le code et afficher les erreurs que je reçois.

(function() { 'use strict'; angular.module('tickets') .service("DataService", DataService) /* @ngInject */ DataService.$inject = ["$rootScope", "$q"]; function DataService($rootScope, $q) { var vm = this; vm.nameDefault = "Name -- Please Authenticate"; vm.name = vm.nameDefault; }; })(); (function() { 'use strict'; angular.module('tickets') .controller('HomeController', HomeController); /* @ngInject */ HomeController.$inject = ['$scope', '$location', 'DataService']; function HomeController($scope, $location, DataService) { var vm = this; vm.name = DataService.name; vm.nameDefault = DataService.nameDefault; }; })();

 <link href="https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.1.0/jasmine.css" rel="stylesheet" /> <script src="https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.1.0/jasmine.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.1.0/jasmine-html.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.1.0/boot.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.0-beta.4/angular.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.0-beta.4/angular-mocks.js"></script> <script> 'use strict'; describe('Controller: HomeController', function() { beforeEach(module('tickets')); var controller, $location, DataService; var tests = 0; beforeEach(inject(function($controller, _$location_, _DataService_) { $location = _$location_; DataService = _DataService_; scope = {}; controller = $controller('HomeController', {}); })); var controller, scope, $location, DataService; var tests = 0; /* // This version works up until I try to verify the name and nameDefault in controller \\ * * beforeEach(inject(function ($rootScope, $controller, _$location_, _DataService_) { * $location = _$location_; * DataService = _DataService_; * scope = $rootScope.$new(); * * controller = function () { * return $controller('HomeController', {}); * }; * })); */ afterEach(function() { tests += 1; }); describe('local variables', function() { describe('load the data model and values for all pertinent variables', function() { it('should be instantiated', function() { expect(DataService).toBeDefined(); }); it('should contain a name with an initial value before authentication', function() { expect(DataService.nameDefault).toBe('Name -- Please Authenticate'); expect(DataService.name).toEqual(DataService.nameDefault); }); }); describe('should load the controller with data model values, and update as data model values update', function() { it('should be instantiated', function() { expect(controller).toBeDefined(); }) it('should not have a vm attribute that can be reached from here', function() { expect(controller.vm).toBeUndefined(); }) it('should contain a name with an initial value before authentication, both from the data model', function() { expect(controller.name).toBe(DataService.name); expect(controller.nameDefault).toBe(DataService.nameDefault); }); }); }); it('should have tests', function() { expect(tests).toBeGreaterThan(0); }); }); </script>

Mon code, lorsque je l'utilise dans notre environnement natif, fonctionne pour vérifier que tout dans le service de données a été instancié correctement (et en utilisant le bloc de commentaire avant tout), mais le style à l'aide de l'exemple dans la question mentionnée ci-dessus jette encore plus d'erreurs La portée n'est pas instanciée, même si elle est la même (avec des dépendances ajoutées) que cette question.

Je m'attends à ce que la réponse soit similaire à la question (actuellement sans réponse): comment tester les contrôleurs John Papa vm.model et les unités d'unités testées avec du jasmin?

J'apprécie toute aide que vous offrez.

-C§

Edit Même si j'ai répondu et j'ai réussi, j'aimerais avoir des commentaires sur la raison pour laquelle la mise en œuvre ci-dessous fonctionne et les deux autres tentatives ne le font pas. Ceci utilise Karma version 0.13.8 (dernière), jasmine 2.1.0 et Angular 1.4.0.

Je sais qu'il semble que je trouve la solution assez rapidement, mais j'ai lutté avec ça depuis vendredi après-midi (8/7) et j'ai essayé une douzaine de formats différents sans succès.

Encore une fois, j'apprécie vos commentaires et vos votes afin que je puisse mieux comprendre pourquoi la version ci-dessous fonctionne et les autres n'ont pas, d'autant plus que je suis encore très verte chez AngularJS (1 mois maintenant).

Merci encore,

-C§

Je l'ai maintenant. Il fallait juste regarder l' objet globalement simulé dans angularjs pour les tests de jasmin / karma et mon cerveau a cliqué.

La déclaration et avant chaque bloc au début du test doit ressembler à ceci:

  var controller, scope, $location, DataService; var tests = 0; beforeEach(inject(function ($rootScope, $controller, _$location_, _DataService_) { $location = _$location_; DataService = _DataService_; scope = $rootScope.$new(); controller = $controller('HomeController', { $scope: scope }); }));

Je pense que depuis que je me suis dérangé avec notre configuration initiale un peu trop (a commencé le SPA à partir d'un modèle), j'ai eu une mise en œuvre étrange pour que tout fonctionne. Je fais maintenant des tests réussis tout au long de:

Entrez la description de l'image ici

J'espère que cela aidera quelqu'un d'autre avec des problèmes similaires.