Tetiana Chupryna Tetiana Chupryna - 3 months ago 17
AngularJS Question

Karma error Argument 'Controller' is not a function, got undefined

I got a problem when I tried to test my controller. When I run my test I got an error

Error: [ng:areq] Argument 'MainCtrl' is not a function, got undefined http://errors.angularjs.org/1.3.8/ng/areq?p0=MainCtrl&p1=not%20a%20function%2C%20got%20undefined
at assertArg (/Users/tetianachupryna/project/bower_components/angular/angular.js:1577)
at assertArgFn (/Users/tetianachupryna/project/bower_components/angular/angular.js:1588)
at /Users/tetianachupryna/project/bower_components/angular/angular.js:8418
at /Users/tetianachupryna/project/src/spec/controllers/main-controller.spec.js:11
at /Users/tetianachupryna/project/src/spec/controllers/main-controller.spec.js:17
at /Users/tetianachupryna/project/node_modules/karma-jasmine/lib/adapter.js:184
at http://localhost:9877/karma.js:185
at http://localhost:9877/context.html:51


I know that SO is full of similar questions. But I'm a total null in Angular and JS in general, so those answers didn't help me. From similar questions on SO I discovered that my problem is in wrong definition of the controller but I still can't figure out what I did wrong. I've stack and I'm begging for your help.

First of all here is my src/app/index.js file where my module is defined

var app = angular.module('myModule', [
'ngAnimate',
'ngSanitize',
'ngResource',
'ui.router',
'pascalprecht.translate',
'thing1',
'thing2']);


Here is src/app/controllers/main-controller.js

angular.module('myModule').controller('MainCtrl', [
'$scope',
'$state',
function ($scope, $state) {
$scope.state = $state;
//***
$scope.isBigStep = function isBigStep() {
return $state.$current.step == 3;
};
}]);


And finally this a file with the test src/spec/controllers/main-controller.spec.js

describe('MainCtrl', function() {
var scope, $state, createController;

beforeEach(inject(function ($rootScope, $controller) {
scope = $rootScope.$new();

createController = function() {
return $controller('MainCtrl', {
'$scope': scope
});
};
}));

it('should make 3 as current step', function() {
var controller = createController();
expect(scope.isBigStep()).toBe(true);
});
});


In karma config I have all those files

files: [
'bower_components/angular/angular.js',
'bower_components/angular-mocks/angular-mocks.js',
'src/app/index.js',
'src/app/controllers/*.js',
'src/spec/controllers/*.js'
],


For run my test I use karma-runner plugin in RubyMine.

I'd be thankful for any help!

PSL PSL
Answer

What you are missing is to add the module in the beforeEach hook for test setup. Otherwise the controller will not be found. So add beforeEach(module('myModule')).

describe('MainCtrl', function() {
  var scope, $state, createController;

  beforeEach(module('myModule')); //<--- Hook module

  beforeEach(inject(function ($rootScope, $controller) {
    scope = $rootScope.$new();

    createController = function() {
      return $controller('MainCtrl', {
        '$scope': scope
      });
    };
  }));

  it('should make 3 as current step', function() {
    var controller = createController();
    expect(scope.isBigStep()).toBe(true);
  });
});
Comments