监视在click事件中调用的函数

Spy on function that's called on click event

本文关键字：调用 函数 事件 click 监视      更新时间：2023-09-26

我做错了什么?试图监视在元素click事件上调用的函数，但测试总是返回false。

规范:

describe('button', function() {
  before(function() {
    this.spy = sinon.spy(window, 'testMethod');
  });
  it('Should call testMethod', function() {
    $('#testBtn').click();
    expect(this.spy.called).to.equal(true);
  });
});

js: 

$('#testBtn').on('click', testMethod);
function testMethod() {
  return true;
}

问题是由于这一行:

$('#testBtn').on('click', testMethod);

在设置间谍之前获取对testMethod的引用。所以它获取原始函数的引用，而不是间谍，然后你在window.testMethod上设置间谍并不重要，因为在点击事件上调用的函数总是原始的testMethod。您有几个选项可以让您的测试工作:

  1. 在后输入$('#testBtn').on('click', testMethod); 设置间谍。例如，你可以把它放在你的before钩子中。

  2. 将$('#testBtn').on('click', testMethod);更改为$('#testBtn').on('click', function () { testMethod(); });。每次处理单击事件时，匿名函数将获取对testMethod的新引用。所以一旦你设置了它，它就会获取一个对spy的引用。

我已经通过创建一个测试来测试我在这里所说的，该测试复制了您的代码并使用了上面的两个修复。

Try

expect(this.spy).to.have.been.called();
不是

expect(this.spy.called).to.equal(true);
相关文章：