UI-Bootstrapのmodalのテストで、$modalInstanceを使うControllerをテストしようとして、$modalInstanceをinjectしようとするところでUnknown providerとエラーが出る
公式のサンプルでいうと、ModalInstanceCtrl部分のテスト。
// modal-demo.js var ModalDemoCtrl = function ($scope, $modal, $log) { $scope.items = ['item1', 'item2', 'item3']; $scope.open = function (size) { var modalInstance = $modal.open({ templateUrl: 'myModalContent.html', controller: ModalInstanceCtrl, size: size, resolve: { items: function () { return $scope.items; } } }); modalInstance.result.then(function (selectedItem) { $scope.selected = selectedItem; }, function () { $log.info('Modal dismissed at: ' + new Date()); }); }; }; // Please note that $modalInstance represents a modal window (instance) dependency. // It is not the same as the $modal service used above. var ModalInstanceCtrl = function ($scope, $modalInstance, items) { $scope.items = items; $scope.selected = { item: $scope.items[0] }; $scope.ok = function () { $modalInstance.close($scope.selected.item); }; $scope.cancel = function () { $modalInstance.dismiss('cancel'); }; };
beforeEachで$modalInstanceをinjectしようとしているところで
#modal_instance_spec.coffee "use strict" describe "Controller: ModalInstanceCtrl", -> # load the controller"s module beforeEach module "myApp" ModalInstanceCtrl = {} scope = {} modalInstance = {} httpBackend = {} # Initialize the controller and a mock scope beforeEach inject ($controller, $rootScope, _$httpBackend_,_$modalInstance_) -> scope = $rootScope.$new()
こんなエラー
Error: [$injector:unpr] Unknown provider: $modalInstanceProvider <- $modalInstance
こんなときはmodalInstanceをmockにしてしまえばOK.
#modal_instance_spec.coffee "use strict" describe "Controller: ModalInstanceCtrl", -> # load the controller"s module beforeEach module "myApp" ModalInstanceCtrl = {} scope = {} modalInstance = {} httpBackend = {} # Initialize the controller and a mock scope beforeEach inject ($controller, $rootScope, _$httpBackend_) -> scope = $rootScope.$new() httpBackend = _$httpBackend_ modalInstance = close: jasmine.createSpy("modalInstance.close") dismiss: jasmine.createSpy("modalInstance.dismiss") result: then: jasmine.createSpy('modalInstance.result.then') ModalInstanceCtrl = $controller "ModalInstanceCtrl", { $scope: scope $modalInstance: modalInstance } it "cancelを呼ぶと、modalをdismissすること", -> scope.cancel() expect(modalInstance.dismiss).toHaveBeenCalled() #........
参考というかそのまま
AngularJSでInterceptorでHeaderを付与するようなケースのテスト
例えば$httpのリクエストをインターセプトして、Authorizationヘッダーにトークンを付与するInterceptorを作成したとする。
この場合、このInterceptorのサービスをどのようにテストするのがよいのか?
で、調べたら大変素晴らしい記事があったのでそちらを参考にテストを書いた。
トークンを管理しているサービス、Authorizationヘッダーを付与するInterceptorサービス、モックの$httpBackend,あとはInterceptorが登録されているはずの $httpProviderを読み込んでる。
# auth_interceptor_spec.coffee 'use strict' describe 'Service: AuthInterceptor', -> $httpProvider = {} beforeEach module 'gambaApp', (_$httpProvider_)-> $httpProvider = _$httpProvider_ return AuthInterceptor = {} AuthToken = {} $httpBackend = {} beforeEach inject (_AuthInterceptor_, _AuthToken_, _$httpBackend_) -> $httpBackend = _$httpBackend_ AuthInterceptor = _AuthInterceptor_ AuthToken = _AuthToken_ afterEach inject (_AuthToken_) -> _AuthToken_.clear() token = 'SecureToken' tokenString = "Token token=\"#{token}\"" it "AuthInterceptorが定義されていること", -> expect(AuthInterceptor).toBeDefined() it "AuthInterceptorがインターセプターに登録されていること", -> expect($httpProvider.interceptors).toContain "AuthInterceptor" it 'トークンがセットされていない場合Authorizationがセットされていないこと', -> config = AuthInterceptor.request({headers: {}}) expect(config.headers.Authorization).toBeUndefined() it 'トークンが保持されている場合setting後Authorizationにセットされること', -> AuthToken.setToken(token) config = AuthInterceptor.request({}) expect(config.headers.Authorization).toBe tokenString it 'トークンが保持されて通信されるときはAuthorizationにセットされていること', -> AuthToken.setToken(token) $httpBackend.whenGET('/api/users', (headers)-> expect(headers.Authorization).toBe tokenString )