user2255226 user2255226 - 1 year ago 77
AngularJS Question

Angular Testing Example Fail

Being new to JS unit testing and Angular testing in particular, I tried writing my own tests with Jasmine and Karma. After numerous failed attempts at writing my own tests, I decided to step back and check whether everything is working properly, so I copied the example controller and its tests from the Angular Documentation on Unit testing into my project and I am unable to get even that to work.. I feel like a complete idiot that can't even get the copy-pasted code to work..

So here is the controller that I have initialized in the


Module is initialized in another file.

var mainApp = angular.module("mainApp");

mainApp.controller('PasswordController', function PasswordController($scope) { $scope.password = ''; $scope.grade = function() {
var size = $scope.password.length;
if (size > 8) {
$scope.strength = 'strong';
} else if (size > 3) {
$scope.strength = 'medium';
} else {
$scope.strength = 'weak';
} }; });

And here's are the tests that live inside

describe('PasswordController', function() {

var $controller;

// The injector unwraps the underscores (_) from around the parameter names when matching
$controller = _$controller_;

describe('$scope.grade', function() {
var $scope, controller;

beforeEach(function() {
$scope = {};
controller = $controller('PasswordController', { $scope: $scope });

it('sets the strength to "strong" if the password length is >8 chars', function() {
$scope.password = 'longerthaneightchars';

it('sets the strength to "weak" if the password length <3 chars', function() {
$scope.password = 'a';

Literally copy-pasted from the documentation.

So the error that I get upon running the tests is:

TypeError: undefined is not a constructor (evaluating '$controller('PasswordController', { $scope: $scope })')

Which tells me that the
function in the second
is failing, as
is undefined. So it looks like the first
doesn't run, or it does but an undefined value gets injected with the

I am also using
, if that matters.

Here is my
, if that helps, as well:

module.exports = function(config) {

basePath: '',

frameworks: ['browserify', 'jasmine'],

files: [

exclude: [

preprocessors: {
'app/main.js': ['browserify']

reporters: ['progress'],

port: 9876,

colors: true,

logLevel: config.LOG_INFO,

autoWatch: true,

browsers: ['PhantomJS'],

browserify: {
debug: true,
transform: []

plugins: [
'karma-phantomjs-launcher', 'karma-jasmine', 'karma-bro'

singleRun: false,

concurrency: Infinity

Answer Source

I have finally managed to figure out what the problem was. PhantomJS wasn't descriptive with the error messages at all. Apparently, it was failing to instantiate my main Angular module mainApp, because I didn't include some source files for external modules that my main module depends on (like ngAnimate, etc.).

So I switched my testing browser from PhantomJS to Chrome and it actually gave me meaningful errors that quickly pointed in the right direction.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download