Using angular.mock.inject in karma gives "TypeError: Cannot read property '$injector' of null"

Question

I am trying to do some basic Unit testing for AngularJS using Karma. All the tests I have written seem syntactically correct. But I am having a problem at the most basic step, i.e the beforeEach part of the code. When I try running the test, I get the following problem

TypeError: Cannot read property '$injector' of null
at Object.workFn (http://localhost:9876/absolute/Users/vesriram/Documents/AngularJS%20project/vendor/js/angular-mocks.js:1698:15)
at Object.<anonymous> (http://localhost:9876/adapter/lib/angular-scenario.js:26360:54)
at Array.forEach (native)
at Object.forEach (http://localhost:9876/adapter/lib/angular-scenario.js:9593:11)

I have been trying to solve this problem for the past 36 hours and have had no luck so far. As far as I can see, noone else seems to be having this problem. This makes me think that I am possibly doing something stupid. I would really appreciate any help you people could give me. I will be happy to post any additional code that you need (so long as I am at liberty to divulge it).

The relevant code is the following-

app.js

var sell_page = angular.module("sell_page", ['ui.bootstrap']);

sell_page.controller('ItemTitleController', ['$scope','listingInformationService', '$location',function($scope, listingInformationService, $location) {
    $scope.itemNames = getAllItemNames();
    $scope.draftItems = getAllSavedDrafts();
    document.getElementById("categorySelection").style.visibility = "hidden";

    ------bunch of code-------
}]); 

controllersSpec.js

describe("Unit: Testing Controllers", function() {

beforeEach(angular.mock.module('sell_page'));

it('should have a ItemTitleController controller', function() {
    expect(sell_page.ItemTitleController).not.to.equal(null);
});


describe("ItemTitleController", function() {
    var scope;
    beforeEach(angular.mock.module('sell_page'));
    beforeEach(angular.mock.inject(function($rootScope, listingInformationService, $location, $controller) {
        var scope = $rootScope.$new();
        var controller = $controller('ItemTitleController', {
            $scope : scope
        });
    }));

    it("should display xxx properly", function() {
        --some code---
    });

});

karma.conf.js

basePath = '';

files = [
   JASMINE,
   JASMINE_ADAPTER,
   '../vendor/js/angular.min.js',
   '../vendor/js/angular.js',
   '../vendor/js/angular-mocks.js',
   '../vendor/js/angular-scenario.js',
   ANGULAR_SCENARIO,
   ANGULAR_SCENARIO_ADAPTER,
   '../app/js/*.js',
   'e2e/*.js',
   'midway/*.js',
   'unit/*.js',    
];

exclude = [
];

reporters = ['progress'];
port = 9876;
runnerPort = 9100;
colors = true;
logLevel = LOG_INFO;
autoWatch = true;
browsers = ['Chrome'];
captureTimeout = 60000;
singleRun = false;

Answer 1

I honestly don't know if this is the fix at all, and it probably only works for Mocha, but I was running into the same thing and I changed the first beforeEach bit to this:

beforeEach(function() { module('myApp'); });

and it seems to be working better. It seems like the timing of the angular.mocks.module call works out better if you let the testing framework (mocha in my case) have a wrapped version of the method.