Question

我在茉莉花的间谍活动中遇到了一些麻烦

我想检查是否使用jasmine spy和jasmine jquery在滑块上单击了一个链接。

这是一个简化版本：

我有一些链接作为html fixture文件的一部分。

<a href="#" class="someLink">Link 1</a>
<a href="#" class="someLink">Link 2</a>

滑块：

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文件：

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();
    });

});

测试失败。但是“我已被点击”已被记录到控制台，因此正在调用该方法。

如果我这样做，测试通过：

it('should handle link click', function(){
        spyon(slider, 'handleClick');
        slider.handleClick();
        expect(slider.handleClick).toHaveBeenCalled();
    });

所以我的问题基本上是：

我是否以错误的方式测试此类事物？
为什么间谍没有注册这个方法被调用的事实？

Answer 1

我刚刚验证了评论中概述的解决方案。您的describe应为：

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();
    });

});

重点是你必须在创建handleClick 之前监视原型Slider函数和。

原因是Jasmine spyOn在您提供的代码中真正做了什么：

spyOn(slider, 'handleClick');

直接在handleClick实例上创建滑块属性slider（包含间谍对象）。在这种情况下，slider.hasOwnProperty('handleClick')会返回true，您知道......

但是，仍然存在绑定点击事件的handleClick原型属性。这意味着只有触发的点击事件由原型handleClick函数处理，而滑块对象拥有的属性handleClick（您的间谍）保持不变。

所以答案是，间谍没有注册这个方法已被调用的事实，因为它从未被调用过： - ）

茉莉花间谍没被召唤

1 个答案: