ReferenceError: module is not defined - Karma/Jasmine configuration with Angular/Laravel app ReferenceError: module is not defined - Karma/Jasmine configuration with Angular/Laravel app angularjs angularjs

ReferenceError: module is not defined - Karma/Jasmine configuration with Angular/Laravel app


Perhaps this will help someone.

The solution, for me, was to make sure angular-mocks.js was loaded before my tests. If you're not sure, you control the order in karma.conf.js under the following section:

// list of files / patterns to load in the browserfiles: [// include files / patterns here

Next, to get my test to actually load my angular app, I had to do the following:

describe("hello world", function() {    var $rootScope;    var $controller;    beforeEach(module("YourAppNameHere"));    beforeEach(inject(function($injector) {        $rootScope = $injector.get('$rootScope');        $controller = $injector.get('$controller');        $scope = $rootScope.$new();    }));    beforeEach(inject(function($controller) {        YourControllerHere = $controller("YourControllerHere");    }));    it("Should say hello", function() {        expect(YourControllerHere.message).toBe("Hello");    });});

And in your controller,

app.controller('YourControllerHere', function() {    this.message = "Hello";});

Also, another way:

describe("YourControllerHere", function() {    var $scope;    var controller;    beforeEach(function() {        module("YourAppNameHere");        inject(function(_$rootScope_, $controller) {            $scope = _$rootScope_.$new();            controller = $controller("YourControllerHere", {$scope: $scope});        });    });    it("Should say hello", function() {        expect(controller.message).toBe("Hello");    });});

Enjoy testing!


The error means angular was not able to inject your module. Most of the time this happens because of missing reference to script files. In this case, make sure to have all your script file is defined under [files] configuration of karma. Pay special attention to paths because if your script folder has nested structure, make sure to list as such. For example:

Scripts/Controllers/One/1.js Scripts/Controllers/One/2.js 

can be listed as in karma.conf.js>files as :

Scripts/Controllers/**/*.js


Just leave this here for future searchers.

If you are running angular unit tests in the browser directly without Karma (or in plunkr or jsfiddle ect...) Then it may be that

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.0/angular.js"></script>     <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.0/angular-route.js"></script>     <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.0/angular-cookies.js"></script>     <!-- The Mocha Setup goes BETWEEN angular and angular-mocks -->    <script>      mocha.setup({        "ui": "bdd",        "reporter": "html"      });    </script>    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.0/angular-mocks.js"></script>    <script src="myApp.js"></script>    <script src="myTest.js"></script> <!-- test is last -->

The Mocha Setup goes BETWEEN angular and angular-mocks