Testing Bootstrap modal in an Angular controller
I've been trying to find a way to test this part of the controller for a few days, but keep getting stuck. Now I get ReferenceError: Can't find the variable: $ modal, but I had it injected, so I'm not sure why it doesn't work. I also know that this test I'm writing doesn't really test anything important, so if you have any suggestions for moving forward, let me know. And thanks to everyone who helped me with the code in this controller.
code:
$scope.confirmDelete = function (account) {
var modalInstance = $modal.open({
templateUrl: '/app/accounts/views/_delete.html',
controller: function (global, $scope, $modalInstance, account) {
$scope.account = account;
$scope.delete = function (account) {
global.setFormSubmitInProgress(true);
accountService.deleteAccount(global.activeOrganizationId, account.entityId).then(function () {
global.setFormSubmitInProgress(false);
$modalInstance.close();
},
function (errorData) {
global.setFormSubmitInProgress(false);
});
};
$scope.cancel = function () {
global.setFormSubmitInProgress(false);
$modalInstance.dismiss('cancel');
};
},
resolve: {
account: function () {
return account;
}
}
});
Test:
describe("confirmDelete() function", function () {
var controller, scope;
// sets scope of controller before each test
beforeEach(inject(function ($rootScope, _$modal_) {
scope = $rootScope.$new();
controller = $controller('AccountsController',
{
$scope: scope,
$stateParams: mockStateParams,
$state: mockState,
// below: in order to call the $modal have it be defined and send on the mock modal?
$modal: _$modal_,
//modalInstance: mockModalInstance,
global: mockGlobal,
accountService: mockAccountSrv
});
}));
beforeEach(inject(function ($modal, $q) {
spyOn($modal, 'open').and.returnValue({
result: $q.defer().promise
});
}));
it("make sure modal promise resolves", function () {
scope.confirmDelete(mockAccountSrv.account);
expect($modal.open).toHaveBeenCalled();
});
});
+3
source to share
1 answer
You need to set a modal variable to be able to use it.
i.e
describe("confirmDelete() function", function () {
var controller, scope, $modal; //Initialize it here
//....
beforeEach(inject(function ($rootScope, _$modal_, $controller) {
$modal = _$modal_; //Set it here
And you need to enter as well $controller
to be able to use it.
+3
source to share