$controller service throwing error while loading controller - angularjs

Question

I'm using Angular 1.5.8. Here is my code:
describe('My Controller', function() {
var MyController;
var $controller;
var $rootScope;
var $state;
beforeEach(angular.mock.module('ui.router'));
beforeEach(module('app.my.ctrl'));
beforeEach(inject(function(_$controller_, _$rootScope_, _$state_) {
$controller = _$controller_;
$rootScope = _$rootScope_;
$state = _$state_;
MyController = $controller('MyController', { scope: $rootScope.$new() });
}));
describe('#init', function() {
it('should do something', function() {
console.log('logStatement', MyController);
MyController.init();
expect(true).toBe(true);
})
})
});
The test runner is able to locate all files, so this isnt a case of forgetting to load something. When I run this test, not only does the logStatement never appear, I get this error:
Argument 'MyController' is not a function, got undefined
This is my controller:
(function() {
'use strict';
angular
.module('app.my.ctrl')
.controller('MyController', MyController);
MyController.$inject = [
'$scope'
];
/* ngInject */
function MyController($scope) {
var vm = this;
vm.hello = 'world';
vm.init = function() {
return true;
}
}
})();
and this is my karma conf file:
// Karma configuration
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: [
'bower_components/angular/angular.js',
'bower_components/angular-mocks/angular-mocks.js',
'bower_components/angular-ui-router/release/angular-ui-router.js',
'src/controllers/MyController.js',
'tests/unit/**/*.spec.js',
],
// list of files to exclude
exclude: [
'**/*.swp'
],
// 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: ['spec'],
// Spec Reporter Config
specReporter: {
// suppressErrorSummary: false,
// suppressFailed: false,
// suppressPassed: false,
suppressSkipped: true
// showSpecTiming: false
},
// 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: ['Chrome'],
// Continuous Integration mode
// if true, Karma captures browsers, runs the tests and exits
singleRun: true,
// Concurrency level
// how many browser should be started simultaneous
concurrency: Infinity
})
};
What does this mean?? I can't find anything in the documentation that would explain this.
UPDATE:
I've read this answer and the answer has not worked.

Answer 1

Trying change the service injected in the controller from scope to $scope
beforeEach(inject(function(_$controller_, _$rootScope_, _$state_) {
$controller = _$controller_;
$rootScope = _$rootScope_;
$state = _$state_;
MyController = $controller('MyController', { $scope: $rootScope.$new()});
}));

Answer 2

Did you try to make your pb as simple as possible? Inside the application can you successfully make this call? $controller('MyController', { $scope: $rootScope.$new()}); . If this works (it actually should), the problem definitively comes from your test/jasmin/karma/gulp/grunt configuration and you shouldn't dig into angular direction anymore. Can you give us a look at how you define the app.my.ctrl module in your application? Maybe this module depends on more modules than only ui.router that you mock in your test. If it's the case, the module can't be loaded, and any controller inside can't be created either.

Answer 3

describe('My Controller', function() {
var MyController;
var scope;
beforeEach(angular.mock.module('ui.router'));
beforeEach(module('app.my.ctrl'));
beforeEach(inject(function($rootScope) {
scope = $rootScope.$new();
}));
describe('#init', function() {
it('should do something', function($componentController) {
var MyController = $componentController('MyController', {
$scope : scope
});
MyController.init();
expect(true).toBe(true);
})
})
});