web-dev-qa-db-ja.com

Jasmine&Karmaを使用したモジュラーAngularJSのテスト

Jasmine/Karmaでユニットテストをセットアップするのに苦労しています。サービス依存関係のあるコントローラーがあり、そのサービスには別のサービス依存関係があります。モジュールをタイプ(ディレクティブ、サービスなど)ごとに整理しているのではなく、機能(レイアウト、summaryViewなど)ごとに整理しています。

アーキテクチャは次のとおりです。

_angular.module('myApp', ['ngResource', 'myApp.base', 'myApp.layout','myApp.common']);
angular.module('myApp.base', ['myApp.common']);
angular.module('myApp.common',[]);
angular.module('myApp.layout',['myApp.common']);
_

コントローラ:

_angular.module('myApp.layout')
    .controller('LayoutCtrl', ['$scope', '$rootScope', '$timeout', 'layoutService', 'urlService', 'BaseService',
        function ($scope, $rootScope, $timeout, layoutService, urlService, BaseService) {
            //controller code here
    });
_

レイアウトサービス:

_ angular.module('myApp.layout')
    .service('layoutService', ['$http', '$resource', '$rootScope', '$location', '$route', 'errorHandlingService', 'utilService',
        function ($http, $resource, $rootScope, $location, $route, errorHandlingService, utilService) {
            //service code here
    });
_

私が理解していることから、単にbeforeEach(module('myApp.layout'));を含めると、レイアウトモジュール内のコントローラー、サービス、フィルター、およびディレクティブにアクセスできるはずです。

代わりに、次のコードは失敗します。

_describe('Layout Controller', function() {
  var ctrl, scope, service;

  beforeEach(module('myApp'));
  beforeEach(module('myApp.layout'));
  beforeEach(inject(function($controller, $rootScope, layoutService) {

      scope = $rootScope.$new();
      service = layoutService;
      //Create the controller with the new scope
      ctrl = $controller('LayoutCtrl', {$scope: scope, layoutService: service});
      dump(scope);
    }));
    it('should exist', function() {
        expect(ctrl).toBeDefined();
    });
});
_

このエラーの場合:

_Chrome 26.0 (Mac) Layout Controller should exist FAILED
    Error: Unknown provider: layoutServiceProvider <- layoutService
        at Error (<anonymous>)
        at http://ajax.googleapis.com/ajax/libs/angularjs/1.0.4/angular.min.js:28:236
        at Object.c [as get] (http://ajax.googleapis.com/ajax/libs/angularjs/1.0.4/angular.min.js:26:13)
        at http://ajax.googleapis.com/ajax/libs/angularjs/1.0.4/angular.min.js:28:317
        at c (http://ajax.googleapis.com/ajax/libs/angularjs/1.0.4/angular.min.js:26:13)
        at Object.d [as invoke] (http://ajax.googleapis.com/ajax/libs/angularjs/1.0.4/angular.min.js:26:147)
        at workFn (http://code.angularjs.org/1.0.4/angular-mocks.js:1754:20)
    Error: Declaration Location
        at window.jasmine.window.inject.angular.mock.inject (http://code.angularjs.org/1.0.4/angular-mocks.js:1740:25)
        at null.<anonymous> (/Users/scottsilvi/svn/BARO/web/src/test/js/unit/myApp.layoutModule.js:6:14)
        at /Users/scottsilvi/svn/BARO/web/src/test/js/unit/myApp.layoutModule.js:1:1
    Expected undefined to be defined.
    Error: Expected undefined to be defined.
        at null.<anonymous> (/Users/scottsilvi/svn/BARO/web/src/test/js/unit/myApp.layoutModule.js:15:16)
Chrome 26.0 (Mac): Executed 10 of 10 (1 FAILED) (0.36 secs / 0.014 secs)
_

考え?

14
Scott Silvi

多くの場合、不明なプロバイダーのエラーは、ファイルがロードされていないか、間違った順序でロードされていることが原因です。テストの実行中に存在するファイルを確認してください。

10
Jmr

この種のエラーは主に、karma.config.jsファイル内のファイルの誤った宣言が原因で発生します。 karma-jasmineのセットアップでは、karma.config.jsファイルのfile:[]ブロック内のすべてのファイルは、ロードされると予想される順序である必要があります。メインモジュールは、カスタムサービスの依存性注入を行ってから、最初にそのサービスをロードし、次にメインモジュールをロードします。

0
samyak bhalerao