I am new with Sinon so I wanted to check whether a specific function is being called, this is what I got:
terminalController.controller('CashAcceptorController', [
'PaymentService',
'$rootScope',
'$scope',
'PayingInfo',
'$interval',
'$location',
function (PaymentService, $rootScope, $scope, PayingInfo, $interval, $location) {
PaymentService.start();
....
]);
In tests, I try to check that PaymentService.start() is called on controller instantiation:
describe('CashAcceptorController', function() {
var PaymentService, rootScope, scope, PayingInfo, $interval, $location;
var mySpy = sinon.spy(PaymentService.start());;
beforeEach(module('eshtaPayTerminalApp.controllers'));
beforeEach(module('eshtaPayTerminalApp.services'));
beforeEach(inject(function($controller,
$rootScope, _PaymentService_, _$interval_, _PayingInfo_) {
$interval = _$interval_;
scope = $rootScope.$new();
rootScope = $rootScope.$new();
PaymentService = _PaymentService_;
PayingInfo = _PayingInfo_;
rootScope.serviceNumber = 'm1';
rootScope.phoneNumber = '05135309';
$controller('CashAcceptorController', {
$rootScope : rootScope,
$scope : scope,
$location : $location,
_PaymentService_ : PaymentService,
_$interval_:$interval,
_PayingInfo_:PayingInfo
});
}));
it('should call start paying', function() {
expect(mySpy.callCount).to.equal(1);
});
But this assertion fails. What am I doing wrong? Help please :)
There's a couple of issues with your code
The PaymentService object needs to be assigned before you can spy on it
To add a spy with sinon you need pass the method name as a string eg. sinon.spy(PaymentService, 'start');
I've created a working plunk of the above at http://plnkr.co/edit/AvqS3L?p=preview
Here's the updated test code:
describe('CashAcceptorController', function() {
var PaymentService;
var $controller;
beforeEach(module('eshtaPayTerminalApp.controllers'));
beforeEach(module('eshtaPayTerminalApp.services'));
beforeEach(inject(function(_PaymentService_, _$controller_) {
PaymentService = _PaymentService_;
$controller = _$controller_;
}));
it('should call start paying', function() {
var mySpy = sinon.spy(PaymentService, 'start');
$controller('CashAcceptorController', { PaymentService: PaymentService });
chai.expect(mySpy.callCount).to.equal(1);
// another way of checking that it was called once
chai.assert(PaymentService.start.calledOnce);
});
});
Related
I am trying to test if window.location is set to a specific URL by end of the method, but I get this error:
Error: Injector already created, can not register a module!
The code:
describe('Home controller', function() {
var $controller, $location, $window, $http, $timeout, $filter, $scope, $resource;
beforeEach(module('app', function($provide) {
$provide.value('$window', {
location: {
href: ''
}
});
}));
beforeEach(inject(function(_$controller_, _$location_, _$window_, _$rootScope_, _$http_,
_$resource_, _$timeout_, _$filter_) {
$controller = _$controller_;
$location = _$location_;
$window = _$window_;
$http = _$http_;
$timeout = _$timeout_;
$filter = _$filter_;
$scope = _$rootScope_.$new();
}));
it('check Home Ctrl', inject(function($rootScope, $httpBackend, API_URL) {
var ctrlInstance = $controller('HomeCtrl', {
$scope: $scope,
$rootScope: $rootScope,
$http: $http,
$resource: $resource,
$location: $location,
$window: $window,
$timeout: $timeout,
API_URL: API_URL
});
$scope.goEditUser({
userId: 2
});
expect($window.location.href).toContain('/switch-user/2');
}));
});
Why am I getting the error even when inject is called after module?
You can try to use single inject method :
var ctrlInstance;
beforeEach(module('app');
beforeEach(module(function($provide) {...})
and something like this
it('check Home Ctrl', inject(function($controller, _$location_, _$window_, _$rootScope_, _$http_, _$resource_, _$timeout_, _$filter_) {
var ctrlInstance = $controller('HomeCtrl', {
$location : _$location_,
$window : _$window_,
$http : _$http_,
$timeout : _$timeout_,
$filter : _$filter_,
$scope : _$rootScope_.$new(),
$rootScope: _$rootScope_,
$resource: _$resource_,
API_URL: API_URL
});
$scope.goEditUser({
userId: 2
});
expect($window.location.href).toContain('/switch-user/2');
}));
I am new to developing in angular, and am trying to learn how to test angular controllers. The controller I am testing uses $location.seach().something. I looked at the docs for $location, but don't quickly see how I am supposed to mock this in karma/jasmine.
The controller:
rmtg.controller('ErrorCtrl', ['Session', '$location', '$routeParams', '$scope', '$window',
function(Session, $location, $routeParams, $scope, $window) {
console.log('ErrorCtrl(%o, %o, %o)', $location.path(), $location.search(), $routeParams);
$scope.status = $location.search().status;
$scope.message = $location.search().message;
$scope.isAuthorized = (typeof(Session.auth) === 'object');
$scope.signin = function() {
$window.location = '/signin/#/' + $routeParams.origin + (Session.auth ? '?email=' + Session.auth.email : '');
};
}]);
My current spec attempt:
'user strict';
describe('Testing the errorCtrl controller', function(){
beforeEach(module("rmtg"));
var errorCtrl, scope;
beforeEach(inject(function($controller, $rootScope){
scope = $rootScope;
errorCtrl = $controller("ErrorCtrl", {
$scope: scope
});
}));
it('$scope.status should be set to 404 when location is set to 404', function(){
//set the $location.search values so that the scope is correct
$location.search('status', '404');
expect(scope.status).toBe('404');
});
});
And the current error message:
Testing the errorCtrl controller $scope.status should be set to 404 when location is set to 404 FAILED
Expected undefined to be '404'.
at Object. (/Users/adamremeeting/git/mrp-www/app/tests/example.js:20:24)
I'd also really appreciate links to resources on tdd with angular 1.5 and how I mock and stub correctly.
Edit After Answer
So I updated the test as per user2341963 suggestions, and did my best to look through his plunker example, but still don't have a passing test.
the current spec (controller has not changed from above)
'user strict';
describe('ErrorCtrl', function(){
beforeEach(module("rmtg"));
var scope, $location, $controller;
beforeEach(inject(function(_$controller_, _$rootScope_, _$location_){
scope = _$rootScope_.$new();
$location = _$location_
$controller = $_controller_;
}));
describe('$scope.status', function(){
it('should set status to 404', function(){
//set the $location.search values so that the scope is correct
$location.search('status', '404');
//init controller
$controller('ErrorCtrl', {
$scope: scope,
$location: $location
});
expect(scope.status).toBe('404');
});
});
});
But I am getting an error now that $controller is not defined.
You are getting undefined in your test because you are not setting $location anywhere.
Based on your controller, the search parameters must be set before the controller is initialised. See plunker for full example.
describe('testApp', function() {
describe('MainCtrl', function() {
var scope, $location, $controller;
beforeEach(module('myApp'));
beforeEach(inject(function(_$rootScope_, _$controller_, _$location_) {
scope = _$rootScope_.$new();
$location = _$location_;
$controller = _$controller_;
}));
it('should set status to 404', function() {
// Set the status first ...
$location.search('status', '404');
// Then initialise the controller
$controller('MainCtrl', {
$scope: scope,
$location: $location
});
expect(scope.status).toBe('404');
});
});
});
As for resources, so far I've found the angular docs are good enough.
There is the following controller definition:
angular.module('app.controllers', []).controller('HomeController', [
'$scope', '$modal', 'Point', function($scope, $modal, Point) { //some action }
I want to test this controller:
describe('HomeController', function() {
beforeEach(module('app.controllers'));
var $controller;
beforeEach(inject(function(_$controller_){
// The injector unwraps the underscores (_) from around the parameter names when matching
$controller = _$controller_;
}));
describe('$scope.grade', function() {
it('sets the strength to "strong" if the password length is >8 chars', function() {
var $scope = {};
var controller = $controller('HomeController', { $scope: $scope });
$scope.label = '12345';
$scope.addNewPoint();
expect($scope.label).toEqual(null);
});
});
});
"Point" is my custom service, "$modal" is Angular Bootstrap module. How can I inject it in my tests? Thanks in advance!
The services should be automatically injected. If you wish to mock them or spy on them, inject them like so:
describe('HomeController', function() {
beforeEach(module('app'));
var $controller, $scope, $modal, Point;
beforeEach(inject(function(_$controller_, _$rootScope_, _$modal_, _Point_){
$scope = $rootScope.$new();
$modal = _$modal_;
Point = _Point_;
spyOn($modal, 'method');
spyOn(Point, 'method');
$controller = _$controller_('HomeController', { $scope: $scope, $modal: $modal, Point: Point });
}));
describe('$scope.grade', function() {
it('sets the strength to "strong" if the password length is >8 chars', function() {
$scope.label = '12345';
$scope.addNewPoint();
expect($scope.label).toEqual(null);
});
});
});
I have the following...
app.controller('testCtrl', function(testService){
testService.doSomething();
});
app.service('testService', function(){
this.doSomething = function(){...};
});
I want to use Jasmine to ensure doSomething is called once and only once. I seem to be having some trouble doing this.
Also, I am currently grabbing my controller from a compiled element like this...
var element = angular.element('<my-test-directive />');
controller = view.controller('testCtrl');
So extra appreciation if it fits with this sort of formatting
Update
I tried this...
describe("Testing", function () {
var $rootScope,
$scope,
$compile,
testService,
view,
$controller;
beforeEach(module("app"));
function createController() {
return $controller('testCtrl', {
$scope: scope,
testService:testService
});
}
function SetUpScope(_$controller_, _$compile_, _$rootScope_, _testService_) {
$compile = _$compile_;
$rootScope = _$rootScope_;
$scope = $rootScope.$new();
$controller = _$controller_;
testService = _testService_;
spyOn(testService, 'doSomething');
}
SetUpScope.$inject = ["$controller","$compile", "$rootScope", "testService"];
beforeEach(inject(SetUpScope));
it("On intitialization, the controller should register itself with the list service", function(done){
createController();
scope.$digest();
expect(workOrderService.doSomething).toHaveBeenCalled();
})
});
It seems to work
It is probably better to test controller in isolation and use Jasmine spies for this:
spyOn(testService, 'doSomething');
expect(testService.doSomething.calls.count()).toEqual(0);
Something like this should work in the actual test.
describe('testCtrl function', function() {
describe('testCtrl', function() {
var $scope, testService;
beforeEach(module('myApp'));
beforeEach(inject(function($rootScope, $controller, _testService_) {
$scope = $rootScope.$new();
testService = _testService_;
spyOn(testService, 'doSomething');
$controller('MyController', {$scope: $scope});
}));
it('should call testService.doSomething()', function() {
expect(testService.doSomething.calls.count()).toEqual(1);
});
});
});
Here is a quick plunkr http://plnkr.co/edit/Swso4Y
Depending on which version of Jasmine you are using you might need to use
expect(testService.doSomething.calls.length).toEqual(1);
This is my first time testing using Jasmine. I'm having trouble accessing the $scope variables in the spec. I have a failing test:
mysite ProductsDetailCtrl sets hey
Expected undefined to be 1.
Error: Expected undefined to be 1.
spec:
//= require helpers/load-angular-mysite-module
//= require products/controllers/products_detail_controller
describe('mysite', function() {
var $rootScope, $scope, $controller;
beforeEach(function() {
module('mysite');
});
describe('ProductsDetailCtrl', function() {
beforeEach(inject(function(_$rootScope_, _$controller_) {
$rootScope = _$rootScope_; // don't really
$scope = $rootScope.$new(); // understand what's
$controller = _$controller_; // going on in this function
controller = $controller('ProductsDetailCtrl', {
'$rootScope': $rootScope,
'$scope': $scope
});
}));
it('sets hey', function() {
expect($rootScope.hey).toBe(1);
});
});
});
controller:
app.controller('ProductsDetailCtrl', ['$scope', '$resource', function($scope, $resource) {
$scope.hey = 1;
....
Could someone explain to me how I would access the scope?
You just have to check for the property heyin your $scope not in the $rootScope:
describe('mysite', function() {
var scope, ProductsDetailCtrl;
beforeEach(function() {
module('mysite');
});
describe('ProductsDetailCtrl', function() {
beforeEach(inject(function($controller, $rootScope) {
// Create a mock scope for your controller.
scope = $rootScope.$new();
// Initialize the controller with the mocked scope.
ProductsDetailCtrl = $controller('ProductsDetailCtrl', {
$scope: scope
});
}));
it('sets hey', function() {
expect(scope.hey).toBe(1);
});
});
});