Search code examples
javascriptangularjsjasminekarma-jasminengtable

AngularJS - mocking ngTableParams in jasmine test case


I have created an application using ng-table , the application is workign fine but when i wrote a jasmine test case i am getting.

Error: [$injector:unpr] Unknown provider: TableParamsProvider

Can anyone please tell me how to mock the ngTableParams and test its functionality

My code is as given below

jasmine test case

describe('Testing Controllers', function() {
    describe('Testing WorkController Controller', function() {
        var WorkController, $scope;

        beforeEach(module('wsd.workstations'));

        beforeEach(inject(function($controller, $rootScope) {
            $scope = $rootScope.$new();
            WorkController = $controller('WorkController', {
                $rootScope: $rootScope,
                $scope: $scope
            });
        }));

        it('should searchDocuments when searchDocuments() is called', function() {
            $scope.searchDocuments();
        });
    });
});

script

angular.module('wsd', ['restangular', 'ngTable', 'wsd.models', 'wsd.workstations', 'wsd.workperiods', 'ngRoute'])

.config(function(RestangularProvider, $routeProvider) {
    RestangularProvider.setBaseUrl('/rest/myuser');

    $routeProvider.when('/wd', {
        templateUrl: 'main/workstation/main.tpl.html',
        controller: 'WorkController',
        resolve: {
            myWorkDocuments: function(Documents) {
                return Documents.getWorkDocuments();
            }
        }
    }).when('/wp', {
        templateUrl: 'main/workperiod/main.tpl.html',
        controller: 'PeriodController',
        resolve: {
            myWorkPeriods: function(Periods) {
                return Periods.getWorkPeriods();
            }
        }
    }).otherwise({
        redirectTo: '/wd'
    });
});

workstation/main.js

angular.module('wsd.workstations', [])

.controller('WorkController', function($rootScope, $scope, $filter, ngTableParams)
{ 
   $scope.myValues = [{name: "Moroni", age: 50},
                {name: "Tiancum", age: 43},
                {name: "Jacob", age: 27},
                {name: "Nephi", age: 29},
                {name: "Enos", age: 34},
                {name: "Tiancum", age: 43},
                {name: "Jacob", age: 27},
                {name: "Nephi", age: 29},
                {name: "Enos", age: 34},
                {name: "Tiancum", age: 43},
                {name: "Jacob", age: 27},
                {name: "Nephi", age: 29},
                {name: "Enos", age: 34}, 
                {name: "Tiancum", age: 43},
                {name: "Jacob", age: 27},
                {name: "Nephi", age: 29},
                {name: "Enos", age: 34}];

    $scope.tableParams = new ngTableParams({
        sorting: {
            name: 'asc'     
        }
    }, {
        getData: function($defer, params) {
            $scope.myValues = $filter('orderBy')($scope.myValues, params.orderBy());
            $defer.resolve($scope.myValues);
        }
    });


    $scope.searchDocuments = function() 
    {
        // some other logic
    };
});

Solution

  • First, make sure that you app depends on ngTable. Is it inside 'main'?

    Now for the test:

    beforeEach(inject(function($controller, $rootScope, $filter, ngTableParams) {
        $scope = $rootScope.$new();
        WorkController = $controller('WorkController', {
            $rootScope: $rootScope,
            $scope: $scope,
            $filter: $filter,
            ngTableParams: ngTableParams
        });
    }));
    

    Notice how you must explicitly provide every dependency as a parameter for injector.

    edit: igorzg solution will work too if you don't want to test anything associated with $scope.tableParams

    another edit: You need to let angular know what to inject into your controller:

    .controller('WorkController', ['$rootScope', '$scope', '$filter', 'ngTableParams', function($rootScope, $scope, $filter, ngTableParams)
    { 
     // your controller code here
    }]);
    

    Another problem is that in your test you're loading wsd.workstations module, which doesn't have ngTable injected. So you need to:

    angular.module('wsd.workstations', ['ngTable'])
    

    OR in your test:

    beforeEach(module('wsd'));
    

    instead of:

    beforeEach(module('wsd.workstations'));