unit-testing on ionic service undefined - angularjs

Question

happy holidays!, I'm facing an issue that I don't know why it's giving me:
//LoginCtrl:
angular.module('login.controller', [])
.controller('LoginCtrl', function($scope, $state, $translate, $ionicPopup, UserService, Auth) {
// With the new view caching in Ionic, Controllers are only called
// when they are recreated or on app start, instead of every page change.
// To listen for when this page is active (for example, to refresh data),
// listen for the $ionicView.enter event:
//$scope.$on('$ionicView.enter', function(e) {
//});
// Form data for the login modal
$scope.loginData = {};
// Perform the login action when the user submits the login form
$scope.doLogin = function() {
var onSuccess = function(response) {
if (response.data.user !== null) {
Auth.setUser(response.data.user);
Auth.setToken(response.data.user.token);
$state.go('app.main');
} else if (response.data.result == 101) {
$ionicPopup.alert({
title: $translate.instant('login_error'),
template: $translate.instant('login_not_verified')
});
}else {
$ionicPopup.alert({
title: $translate.instant('login_error'),
template: $translate.instant('login_bad_password_text')
});
}
};
var onError = function() {
$ionicPopup.alert({
title: $translate.instant('login_error'),
template: $translate.instant('login_error_text')
});
};
console.log('Doing login', $scope.loginData);
UserService.login($scope.loginData.username, $scope.loginData.password).then(onSuccess, onError);
};
$scope.doRegister = function() {
$state.go("register");
};
});
// Login Ctrl Test
describe('LoginCtrl', function() {
var controller,
deferredLogin,
userServiceMock,
stateMock,
scopeMock,
ionicPopupMock;
//Load the App module
beforeEach(module('starter'));
// Instantiate the Controller and Mocks
beforeEach(inject(function($controller, $q, $rootScope, $translate, Auth) {
deferredLogin = $q.defer();
scopeMock = $rootScope.$new();
// mock userServiceMock
userServiceMock = {
login: jasmine.createSpy('login spy')
.and.returnValue(deferredLogin.promise)
};
//mock $state
stateMock = jasmine.createSpyObj('$state spy', ['go']);
//mock $ionicPopup
ionicPopupMock = jasmine.createSpyObj('$ionicPopup spy', ['alert']);
//Instantiate LoginCtrl
controller = $controller('LoginCtrl', {
'$scope' : scopeMock,
'$state' : stateMock,
'$translate' : $translate,
'$ionicPopup' : ionicPopupMock,
'UserService' : userServiceMock,
'Auth' : Auth
});
}));
describe('#doLogin', function() {
// Call doLogin on the Controllers
beforeEach(inject(function(_$rootScope_) {
$rootScope = _$rootScope_;
controller.$scope.loginData.username = 'test';
controller.$scope.loginData.password = 'password';
controller.$scope.doLogin();
}));
it('should call login on userService', function() {
expect(userServiceMock.login).toHaveBeenCalledWith('test','password');
});
describe('when the login is executed,', function() {
it('if successful, should change state to app.main', function() {
//TODO: Mock the login response from userService
expect(stateMock.go).toHaveBeenCalledWith('app.main');
});
it('if unsuccessful, should show popup', function() {
//TODO: Mock the login response from userService
expect(ionicPopup.alert).toHaveBeenCalled();
});
});
});
});
The problem is that when I execute the test when it executes expect(userServiceMock.login).toHaveBeenCalledWith('test','password'); it gives me the following error:
TypeError: undefined is not an object (evaluating 'userServiceMock.login') in unit-tests/login.controller.tests.js (line 56)
I don't know userServiceMock gives me undefined.
Thank you all, if you need more code or something say me please.
This is my karma conf:
// Karma configuration
// Generated on Mon Dec 26 2016 10:38:06 GMT+0100 (CET)
module.exports = function(config) {
config.set({
// base path that will be used to resolve all patterns (eg. files, exclude)
basePath: '',
// frameworks to use
// available frameworks: https://npmjs.org/browse/keyword/karma-adapter
frameworks: ['jasmine'],
// list of files / patterns to load in the browser
files: [
'../www/lib/ionic/js/ionic.bundle.js',
'../www/js/**/*.js',
'../www/lib/angular-mocks/angular-mocks.js',
'../www/lib/angular-translate/angular-translate.js',
'../www/lib/angular-translate-loader-static-files/angular-translate-loader-static-files.js',
'unit-tests/**/*.js'
],
// list of files to exclude
exclude: [
],
// preprocess matching files before serving them to the browser
// available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
preprocessors: {
},
// test results reporter to use
// possible values: 'dots', 'progress'
// available reporters: https://npmjs.org/browse/keyword/karma-reporter
reporters: ['progress'],
// web server port
port: 9876,
// enable / disable colors in the output (reporters and logs)
colors: true,
// level of logging
// possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
logLevel: config.LOG_INFO,
// enable / disable watching file and executing tests whenever any file changes
autoWatch: true,
// start these browsers
// available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
browsers: ['PhantomJS'],
// Continuous Integration mode
// if true, Karma captures browsers, runs the tests and exits
singleRun: false,
// Concurrency level
// how many browser should be started simultaneous
concurrency: Infinity
});
};

Answer 1

The problem was that I was not including translate libs on test.conf, and then that i was not taking the variables from the controller.