I am having some trouble implimenting spying in Jasmine
I want to check if a link has been clicked on a slider using a jasmine spy and jasmine jquery.
Here is a simplified version:
I have some links as part of an html fixture file.
<a href="#" class="someLink">Link 1</a>
<a href="#" class="someLink">Link 2</a>
slider:
var Slider = function(links){
this.sliderLinks = $(links);
this.bindEvents();
}
Slider.prototype.bindEvents = function(){
this.sliderLinks.on('click', this.handleClick);
}
Slider.prototype.handleClick = function(e){
console.log('i have been clicked')
}
spec file:
describe('Slider', function(){
var slider;
beforeEach(function(){
loadFixtures('slider.html');
slider = new Slider('.someLink');
});
it('should handle link click', function(){
spyOn(slider, 'handleClick');
$(slider.sliderLinks[0]).trigger('click');
expect(slider.handleClick).toHaveBeenCalled();
});
});
The test is failing. But the 'i have been clicked' has been logged to the console so the method is being called.
If I do this the test passes though:
it('should handle link click', function(){
spyon(slider, 'handleClick');
slider.handleClick();
expect(slider.handleClick).toHaveBeenCalled();
});
So my question essentially is:
I've just verified the solution outlined in the comment. Your describe
should be:
describe('Slider', function () {
var slider;
beforeEach(function () {
loadFixtures('slider.html');
spyOn(Slider.prototype, 'handleClick');
slider = new Slider('.someLink');
});
it('should handle link click', function (){
$(slider.sliderLinks[0]).trigger('click');
expect(slider.handleClick).toHaveBeenCalled();
});
});
The point is that you have to spy on prototype handleClick
function and before the Slider
creation.
The reason is what Jasmine spyOn
really does in the code you provided:
spyOn(slider, 'handleClick');
creates slider property handleClick
(containing the spy object) directly on the slider
instance. slider.hasOwnProperty('handleClick')
in this case returns true
, you know...
But still, there is handleClick
prototype property to which your click event is bound. That means just triggered click event is handled by the prototype handleClick
function while the slider object own property handleClick
(your spy) stays untouched.
So the answer is that the spy is not registering the fact that the method has been called because it has never been called :-)