javascript - jasmine jquery - 使用数据属性监视事件

Question

如果正确触发以下事件，我很难找到使用 jasmine-jquery 进行测试的正确方法

$(document).on('click', '[data-test]', function(e) {
    ...
});

基本上我想编写 2 个看起来有点像这样的测试（所有 ????? 部分对我来说都是一个谜）：

spyOnEvent(?????????????, 'click');
var fixture = setFixtures('<a data-test="whatever"></a> <a class="dummy"></a>');
var $elem = fixture.find('a[data-test="whatever"]');
var $dummy = fixture.find('.dummy');

it('should be triggered', function() {
    $elem.click();
    expect('click').toHaveBeenTriggeredOn(?????);
});

it('should not be triggered', function() {
    $dummy.click();
    expect('click').not.toHaveBeenTriggeredOn(?????);
});

希望有人可以帮助我解决这个问题 =) 干杯

Answer 1

问题是这toHaveBeenTriggeredOn两种情况都是正确的，因为您在测试中触发了点击。这也不是你想要测试的。您应该测试单击处理程序是否已触发。通常这将通过测试点击处理函数的结果来完成。例如，一个班级发生了变化。

$(document).on('click', '[data-test]', function(e) {
   $(this).addClass('test')
});

var fixture = setFixtures('<a data-test="whatever"></a> <a class="dummy"></a>');
var $elem = fixture.find('a[data-test="whatever"]');
var $dummy = fixture.find('.dummy');

it('should be triggered', function() {
    $elem.click();
    expect($elem.hasClass()). toBeTruthy();
});

it('should not be triggered', function() {
    $dummy.click();
    expect(dummy.hasClass()).toBeFalsy();
});