acostela acostela - 4 months ago 199
AngularJS Question

uibModal provider unknown unitTest

I'm starting to learn how to do unitTesting with jasmine. I read a lot of in internet and SO but I can't solve my problem.

I have a directive which has a controller. That controller is using the service $uibModal to open a modal when I click an element. I'm trying to inject that service from my test but I can't. I read a lot of threads saying that I must pass an instance. I'm trying to do so but I can't. Please any help will be appreciated.

.controller('myController', ['$scope', '$uibModal', function($scope, $uibModal){
var self = this;
//OTHER CODE
self.openMyModal = function(dataInput) {
var modalInstance = $uibModal.open({
animation: true,
bindToController: true,
templateUrl: 'app/myComponent/modals/component-modal.html',
controllerAs: 'componentModalCtrl',
controller: 'componentModalController',
windowClass: 'semi-modal semi-modal--large',
scope: $scope
})
}
//OTHER CODE
}


This is the test where I'm trying to mock this modal.

beforeEach(function(){
angular.mock.module('templates');
angular.mock.module('app.components.myComponent');

angular.mock.inject(function($compile, $rootScope, $templateCache, $controller){
scope = $rootScope;
modalInstance = { close: function(){}, dismiss: function(){}, open: function(){}
};
//Initializing element and doing compile and digest
controller = $controller('myController', {$scope: scope, $uibModal: modalInstance});

})


I'm getting the error


Unknown provider: $uibModalProvider <- $uibModal.


Can I inject this service in another way? What I'm doing wrong?

P.S: I have read this Testing AngularUI Bootstrap modal instance controller

Angular ui bootstrap $uibModalInstance breaks down unit tests

Mocking $modal in AngularJS unit tests

Answer

Finally I solved it. It was a silly error. I imported an additional module that I was missing in my tests. After that I could mock my service and use it without any problem like this.

angular.mock.inject(function($compile, $rootScope, $templateCache, $controller, $uibModal){
    scope = $rootScope;
    uibModal = $uibModal;
    element = angular.element('<directive-tree input-tree=inputTree subsystem=subsystem></directive-tree>');
    $compile(element)(scope);
    scope.$digest();
    controller = $controller('directiveTreeController', {$scope: scope, $uibModal: uibModal});
  });