I'm writing unit tests for my project built on Angularjs with Karma-jasmine. I'm using x-editable library in my app.
I'm trying to unit test a controller which depends on the x-editable library.
But I'm facing the error below :
Error: [$injector:unpr] Unknown provider: editableThemesProvider <- edit ableThemes
I have already added the path of x-editable my in Karma config file :
files:[
......
{ pattern: '../../libs/angular/angular-xeditable/dist/js/xeditable.min.js', watched: false },
........
]
Below the spec file :
beforeEach(inject(function(_$controller_, $rootScope, $localStorage, _editableThemes_, _editableOptions_) {
localStorage = $localStorage;
$controller = _$controller_;
editThemes = _editableThemes_;
editOptions = _editableOptions_;
scope = $rootScope.$new();
leaderboardCtrl = $controller('LeaderboardCtrl', {
$scope: scope,
$modal : modal,
$q: q,
editableOptions: editOptions,
editableThemes: editThemes,
$localStorage: localStorage,
LeaderBoardService : leaderboardService
});
}));
And this is my controller file :
(function() {
'use strict';
angular
.module('app')
.controller('LeaderboardCtrl', leaderboardCtrl);
leaderboardCtrl.$inject = ['$scope', '$q', '$modal', '$localStorage', 'editableOptions', 'editableThemes', 'LeaderBoardService'];
function leaderboardCtrl ( $scope, $q, $modal, $localStorage, editableOptions, editableThemes, LeaderBoardService) {
var event_ID = $localStorage.currentEventId;
editableThemes.bs3.inputClass = 'input-sm';
editableThemes.bs3.buttonsClass = 'btn-sm';
editableOptions.theme = 'bs3';
What am I doing wrong? did i missed something?
Related
I am trying to write test case for angularjs controller via karma jasmine
Getting below error
Error: [$controller:ctrlreg] The controller with the name 'ApproveRejectPackageController' is not registered.
This is my controller code and supporting test case
(function() {
angular.module('Citi.iv.FC')
.controller('ApproveRejectPackageController', ['$scope', '$filter', '$timeout','$uibModal','$sce', '$stateParams', function ($scope,$filter, $timeout, $uibModal, $sce, $stateParams) {});
describe('myserv', function () {
var service;
var data;
beforeAll(function () {
module('Citi.iv.FC')
});
beforeEach(inject(function($controller, $rootScope) {
scope = $rootScope;
secondController = $controller('ApproveRejectPackageController', {$scope: scope});
}));
it('ServiceTestSpec', function () {
expect(2 + 3).toBe(6);
});
});
Please suggest how to fix this.
I have included controller in karma-config file
I injected controller all dependencies into spec.js file and trying to access the scope variable but am getting TypeError: Cannot read property 'itemsByPage' of undefined spec.js file mocked below;
`describe('baseController', function() {
beforeEach(module('seApp'));
var $controller,$scope,$compile, $timeout, $mdSidenav, $log,
$http,$uibModal, $routeParams, $window,$mdDialog;
inject(function($controller,$rootScope,$compile, $timeout,$mdSidenav,
$log, $http,$uibModal, $routeParams, $window,$mdDialog){
$scope = $rootScope.$new();
$compile = $compile,
$timeout =$timeout,
$mdSidenav =$mdSidenav,
$log = $log,
$http = $http,
$routeParams = $routeParams,
$window = $window,
$mdDialog =$mdDialog,
$uibModal = $uibModal;
baseController = $controller('baseController', {
$scope : $scope,
$compile : $compile,
$timeout :$timeout,
$mdSidenav :$mdSidenav,
$log : $log,
$http : $http,
$routeParams : $routeParams,
$window : $window,
$mdDialog : $mdDialog,
$uibModal : $uibModal
});
});
it('check the base controller', function() {
expect(1).toBe(1);
});
describe('check scope', function() {
it('check itemsBy page', function() {
expect($scope.itemsByPage).toEqual('8');
}); });});`
execution report is Executed 2 of 2 (1 FAILED) controller is passing but not able to access scope variable inside the controller. please suggest me am new for jasmine framework
This is the actual error message that I receive:
Uncaught Error: [$injector:unpr] Unknown provider: formsProvider <- forms <- SignupAcclaimController
this is at the start of my test file:
describe("SignUp", function() {
describe("SignupAcclaimController", function () {
beforeEach(module('CL.SignUp'));
var controller, SignupService, $state, scope, identity;
beforeEach(inject(function (_$controller_, _$state_, _SignupService_, _$rootScope_, _identity_) {
$state = _$state_;
scope = _$rootScope_.$new();
SignupService = _SignupService_;
identity = _identity_;
controller = _$controller_('SignupAcclaimController', {
$state: $state,
SignupService: SignupService,
identity: _identity_,
detailsForm: mocks.form
});
}));........
The error occurs when trying to set controller. mocks.form has been declared above this code.
The actual controller is:
(function() {
'use strict';
angular.module('CL.SignUp')
.controller('SignupAcclaimController', SignupAcclaimController);
SignupAcclaimController.$inject = ['$window', '$state', '$log', 'SignupService', 'identity', 'detailsForm', 'forms', '$rootScope', '$scope', '$timeout'];
function SignupAcclaimController($window, $state, $log, SignupService, identity, detailsForm, forms, $rootScope, $scope, $timeout) {
var vm = this, ........
If I change the injector functions signature to be the same as the method signature of the actual controller then expand the controller = to be
controller = _$controller_('SignupAcclaimController', {
$window: _$window_,
$state: $state,
$log: $log,
SignupService: SignupService,
identity: _identity_,
detailsForm: mocks.form,
forms: _forms_,
$scope: scope,
$rootScope: _$rootScope_,
$timeout: _$timeout_
then the error changes to :
Uncaught Error: [$injector:unpr] Unknown provider: formsProvider <- forms
I am new to angular testing. Facing some issues while testing angular code using jasmine.
It will be highly appreciated if you read my question and try to solve my problem as i googled it but could not find any satisfactory solution
Here is my angular app
var app = angular.module('myApp', ['ngAnimate', 'ui.router', 'ui.bootstrap', 'toggle-switch',
'ngTagsInput', 'blockUI', 'ngBootbox', 'ui.select', 'ngSanitize', 'angular.filter']);
app.config(["$httpProvider", "blockUIConfig", function ($httpProvider, blockUIConfig) {
'use strict';
blockUIConfig.autoBlock = false;
$httpProvider.defaults.xsrfCookieName = 'csrftoken';
$httpProvider.defaults.xsrfHeaderName = 'X-CSRFToken';
$httpProvider.interceptors.push('interceptorService');
}]);
And here is controller file:
app.controller('myController', ['$scope', '$filter', '$http', '$window', '$ngBootbox', '$modal', 'dataservice', 'user', 'message_kinds',
function($scope, $filter, $http, $window, $bB, $modal, dataservice, user, message_kinds) {
$scope.user = user;
/controller logic/
}]);
I want to test this controller if $scope.user equals to user or not.Am using jasmine for testing. Here is spec file.
describe("myController", function() {
beforeEach(module('myApp'));
beforeEach(inject(function(_$controller_){
$controller = _$controller_;
}));
describe("myController testing", function () {
it("should update scope.user", function () {
var user = {customer_id: 1};
var my_controller = $controller('myController', { user: user });
expect(my_controller.user).toEqual(user);
});
});
});
I have also included all dependency files like angular.js, angular-mocks.js etc in SpecRunner.html
Having three problems:
Facing [$injector:unpr] http://errors.angularjs.org/1.4.4/$injector/unpr?p0=interceptorServiceProvide error on app.config block regarding $httpProvider
ReferenceError: $controller is not defined in spec.js at line
var my_controller = $controller('myController', { user: user });
How can I test if scope.user is equals to user in expect block?
1) Check this answer, as regards $http/$httpBackend which might help you - you can adapt this to get the answers you're looking for
2) Have you declared $controller (and now $httpProvider) as a variable in the beginning of the describe() block?
3) You should have that already. Your code, at least as I can see, looks like it should work like you want it to.
The app is working properly with my module. But building the following mock returns :
$global_vars is not defined
I imagine that I'm not injecting the module properly. What am I missing here?
describe('CalendarController', function() {
beforeEach(module("$global_vars"));
beforeEach(inject(function($rootScope, $controller, $location, $injector, $global_vars) {
var $httpBackend;
$httpBackend = $injector.get('$httpBackend');
return this.controller = $controller(CalendarController, {
$scope: this.scope,
$location: $location,
$global_vars: $global_vars
});
}));
return it("can be instantiated", function() {
return expect($global_vars).not.toBeNull();
});
});
note: this is a coffeescript translation to vanilla js
UPDATE
Ok so by doing this I get another, possibly better error?
Error: Unknown provider: $httpProvider <- $http <- $global_vars
.
describe 'CalendarController', ->
beforeEach module("$global_vars")
beforeEach module("GlobalService")
beforeEach inject ($rootScope, $controller, $location, $injector) ->
$injector = angular.injector [ '$global_vars' ]
$global_vars = $injector.get('$global_vars')
$global_vars = $injector.get('$global_vars')
#controller = $controller CalendarController, {$scope: #scope, $location: $location}
The bare bones of my backbone.js
angular.module("VarsService", []).factory "$global_vars", ["$http", '$location', ($http, $location) ->
global_vars.get_calendar = ->
console.log 'blam!'