angularjskarma-jasminegulp-karma

Unknown provider error in jasmine test


I am a newbie to angularjs. I am running into an issue with this jasmine test I am trying to write. I get this error - "Error: [$injector:unpr] Unknown provider: $routeProvider". The actual app works fine, I get this error only in tests.

[09:13:05] Starting 'test'...
[09:13:05] Starting 'test:unit'...
INFO [karma]: Karma v0.12.37 server started at http://localhost:9876/
INFO [launcher]: Starting browser PhantomJS
INFO [PhantomJS 1.9.8 (Mac OS X 0.0.0)]: Connected on socket -W6J4Ey8gUxLNUpoIFy1 with id 43527657
PhantomJS 1.9.8 (Mac OS X 0.0.0) sourceControl should convert date FAILED
    Error: [$injector:modulerr] Failed to instantiate module com.cmp.mod.features.sources due to:
    Error: [$injector:unpr] Unknown provider: $routeProvider
    http://errors.angularjs.org/1.4.7/$injector/unpr?p0=%24routeProvider

Here is my controller,

//controller
angular.module('com.cmp.mod.features.sources')
    .controller('SourceControl', function ($modalInstance, $scope, source, sourceHelper) {
        'use strict';

        $scope.close = function() {
            $modalInstance.dismiss();
        };

        $scope.convertDate = function(milliseconds) {
            return sourceHelper.epochToLocaleDateString(milliseconds);
        };

        $scope.source = source;
    });

//test code 
describe('SourceControl', function(){
    angular.mock.module('ngRoute', []);

    beforeEach(module('com.cmp.mod.features.sources'));

    var scope;
    var $modalInstance = {}, mockSource={}, sourceHelper;


    beforeEach(inject(function ($controller, $rootScope, _sourceHelper_) {
         scope = $rootScope.$new();
         sourceHelper = _sourceHelper_;
         $controller('SourceControl', {
            $modalInstance: $modalInstance,
            $scope: scope,
            source: mockSource,
            sourceHelper: sourceHelper
         });
    }));

    it('should convert date', function() {
      expect(true).toBe(true);
    });

});

//component in the module that uses the routeProvider
angular.module('com.cmp.mod.features.adsources')

.config(function ($routeProvider) {
    'use strict';

    $routeProvider
        .when('/sources', {
            templateUrl: 'src/features/sources/sources.part.html',
            controller: 'SourcesControl',
            resolve: {
                sources: function(Source) {
                    return Source.query().$promise;
                }
            }
        })

Here is my karma.conf.js file,

module.exports = function(config) {
    config.set({
        // base path that will be used to resolve all patterns (eg. files, exclude)
        basePath: '../',

        frameworks: ['jasmine'],

        // list of files / patterns to load in the browser
        files: [
          'app/vendor/angular/angular.js',
          'app/vendor/angular-route/angular-route.js',
          'app/vendor/angular-cookies/angular-cookies.js',
          'app/vendor/angular-resource/angular-resource.js',

          'app/vendor/jquery/dist/jquery.js',
          'app/vendor/bootstrap/dist/js/bootstrap.js',

          'app/vendor/angular-bootstrap/ui-bootstrap.js',
          'app/vendor/angular-bootstrap/ui-bootstrap-tpls.js',

          'app/vendor/angular-mocks/angular-mocks.js',
          'app/src/core/declarations.js',
          'app/src/**/*.js',
          'app/src/**/*.spec.js'
        ],

angularjs version I am using - 1.4.7


Solution

  • In the test, you mocked ngRoute module, therefore you don't have $routeProvider. You have to inject the actual module. Try with:

    beforeEach(function () {
        module('ngRoute');
        module('com.cmp.mod.features.sources');
    });
    

    And remove the following:

    angular.mock.module('ngRoute', []);