Error in Karma/Jasmine Unit test - angularjs

Question

This is my AngularJS code:
angular.module('myapp', [])
.controller('MainCtrl', function($scope, $http, $rootScope, $routeParams) {
$scope.name = "Girish";
$scope.sayHello = function() {
$scope.greeting = "Hello " + $scope.name;
};
$scope.commonUrl = "/";
$rootScope.$watch('eng', function() {
$scope.currentLang = $rootScope.CURRENT_LANGUAGE;
});
$scope.homePageFirstSlider = function() {
$scope.anun = "Nar";
$http({
method: 'GET',
url: "/" + "eng" + '/api/getslideritems/main'
}).then(function successCallback(response) {
$scope.Data = response.data;
$scope.loadCss('mainCarousel');
},
function errorCallback(response) {});
};
});
This is a test file:
'use strict';
describe('myapp', function() {
beforeEach(module('myapp'));
var $controller;
beforeEach(inject(function(_$controller_) {
// The injector unwraps the underscores (_) from around the parameter names when matching
$controller = _$controller_;
}));
describe('$scope.sayHello', function() {
it('same tests', function() {
var $scope = {};
var controller = $controller('MainCtrl', { $scope: $scope });
$scope.name = 'Girish';
$scope.sayHello();
expect($scope.greeting).toEqual('Hello Girish');
});
});
});
After I run karma.conf.js file I have this error:
PhantomJS 2.1.1 (Linux 0.0.0) myapp $scope.sayHello same tests FAILED
***Error: [$injector:unpr] Unknown provider: $routeParamsProvider <- $routeParams <- MainCtrl***
http://errors.angularjs.org/1.5.0/$injector/unpr?p0=%24routeParamsProvider%20%3C-%20%24routeParams%20%3C-%20MainCtrl in /var/www/html/famboxv2/public/bower_components/angular/angular.js (line 4397)
loaded#http://localhost:9882/context.js:151:17
PhantomJS 2.1.1 (Linux 0.0.0): Executed 1 of 1 (1 FAILED) ERROR (0.025 secs / 0.004 secs)
Chromium 45.0.2454 (Ubuntu 0.0.0): Executed 1 of 1 (1 FAILED) ERROR (0.008 secs / 0.005 secs)
How can I solve this error?
Unknown provider: $routeParamsProvider <- $routeParams <- MainCtrl

Answer 1

$routeParams service is a part of ngRoute module. So you'll have to include it as a dependency on your module.
Here's how:
angular.module('myapp', ['ngRoute'])
Also you should be mocking the controller in the first beforeEach block instead of mocking it inside a specific test, so that it could be reusable in all your tests.
And your tests will still be failing because you've inject an empty object for $scope instead of creating a new scope using the $rootScope's $new function. So you should be doing the following changes to make them pass:
describe('myapp', function() {
beforeEach(module('myapp'));
//Replace this
beforeEach(inject(function($controller, _$rootScope_){
//With this
// beforeEach(inject(function($controller, _$rootScope_, _$routeParams_, _$http_){
//Uncomment the following comments if needed for writing tests for the $watch function.
// $rootScope = _$rootScope_;
$scope = _$rootScope_.$new();
// $http = _$http_;
// $routeParams = _$routeParams_;
controller = $controller('MainCtrl', {
$scope: $scope,
// $http: $http,
// $rootScope: $rootScope,
// $routeParams: $routeParams
});
}));
describe('$scope.sayHello', function() {
it('same tests', function() {
$scope.name = 'Girish';
$scope.sayHello();
expect($scope.greeting).toEqual('Hello Girish');
});
});
});