16

この状況のように、angular.module()。controller()で作成されたコントローラーがあります

myModule = angular.module('myApp.controllers', [])
                   .controller('testCtrl', ['$scope', function($scope){
                           $scope.test = 'this is a test';
                    }]);

ここで、mochaを使用して、コントローラーが正しく機能しているかどうかをテストする必要があります。Angularでは、コントローラーがグローバル関数として宣言されている例がいくつかあります(例:http://docs.angularjs.org/tutorial/step_04) 。

function PhoneListCtrl() {...}
.....
beforeEach(function() {
   scope = {},
   ctrl = new PhoneListCtrl(scope);
});

it('shod test whatever PhoneListCtrl does ', function() {
   expect(scope.someProp).toBe('whateverValue');
});    

したがって、質問は次のとおりです。

1)angular.module()。controller()を使用して宣言されたコントローラーに対して同様のテストを行うにはどうすればよいですか?

2)モカを使用してそれを行う方法

4

2 に答える 2

28

AngularJSは、テスト中に依存性注入に役立ついくつかの関数を利用できるようにするモックを提供します。

例:

(ジャスミン)

公式チュートリアルの最初のテストを実行し、コントローラーモジュールを定義したとします。(モジュール名に名前空間を付けることもできますが、単純にしておきたいです)

var Controllers = angular.module('controllers', []);

Controllers.controller('PhoneListCtrl', ['$scope', function($scope){
    $scope.phones = [{name: "Nexus S", snippet: "Fast..."},
                     {name: "Motorola XOOM...", snippet: "The Next...."},
                     {name: "MOTOROLA XOOM...", snippet: "The Next, Next..."}];
}]);

次に、アウトアプリ用のモジュールを作成し、コントローラーモジュールを挿入します

var PhonesApp = angular.module('phoneApp', ['controllers']);

最後に、このようにテストできます

describe('phonesApp', function() {
    describe('phoneApp controllers', function() {
        beforeEach(module('controllers'));
        describe('PhoneListCtrl', function() {
            it('should create "phones" model with 3 phones',
                inject(function($rootScope, $controller) {

                var scope = $rootScope.$new();
                var ctrl = $controller("PhoneListCtrl", {$scope: scope });
                expect(scope.phones.length).toBe(3);
            }));
        });
    });
});

私はモカでそれをしていませんが、プロセスは似ていると思います。

Pd:CoffeeScriptを使用してチュートリアルを行いました。関連するビットは、https://gist.github.com/4163147です。

于 2012-11-28T18:48:23.543 に答える
15

mocha を使用している場合は、angular-1.1.1 にアップグレードしない限り、またははサポートされないことangular.mock.moduleに注意してください。angular.mock.inject私は同じボートに乗っていますが、別の問題のためにアップグレードできません。

私のサーバー側のテストはモカであるため、モカを使用したいのですが、両側で同じテストフレームワークを使用したいので、少し困っています。

したがって、inject/module を使用できない場合は、次の方法で試すことができます。

var $injector = angular.injector(['your-app-name', 'ng']),
  $controller = $injector.get('$controller'),
  $scope = $injector.get('$rootScope');

describe('my app controllers', function () {
  describe('FooCtrl', function () {
     it('should do something', function () {
        // scope can be any object you want; could be $rootScope from above
        var params = { $scope: { } },
          ctrl = $controller('FooCtrl', params);
        // TODO: test ctrl
     });
  });
});
于 2012-12-10T19:33:49.277 に答える