用mocha-chai-sinon测试去抖动

Question

我想测试我的debounce函数，但同样适用于下划线或lodash。

我想用mocha，chai的assert和可能的sinon。

我准备了一个codepen。

诗乃的计时器让我很头疼;当我要求我的辩论首先运行时，我仍然会得到一个响应，即去抖回调没有被调用，而它是！

我们来看看代码：

// sinon timers
it('should not run debounced function too early', function() { 
  var clock = sinon.useFakeTimers();
  var delay = 100;
  var targetFn = sinon.spy();
  var delayedFn = g3.debounce(targetFn, {delay: delay, fireStart: false, fireLast: true});
  // for lodash:
  //var delayedFn = _.debounce(targetFn, delay, {leading:false, trailing:true});
  delayedFn();
  clock.tick(delay - 1);
  clock.restore(); 
  sinon.assert.notCalled(targetFn); 
});

当我们更改控制第一个/最后一个控制的值时，我们从下划线获取错误结果。有人可以提出替代方案吗？纠正？

我也发现this链接可能在Jasmine中进行测试。

我想将下一个块修改为mocha：

it('should only happen once', function(){
    var count = 0;
    runs(function(){
        var fn = underscore.debounce(function(){
            count += 1;
        }, 100);

        fn();
        fn();
        fn();
    });

    waitsFor(function(){
        return count > 0;
    }, 'didnt execute', 200);

    runs(function(){
        expect(count).toBe(1);
    });
});

这可能吗？

我只能看到这个摩卡测试成功：

  it('shouldnt execute immediately', function(){
    var hasHappened = false;

    var fn = g3.debounce(function(){
        hasHappened = true;
    }, {fireFirst: false, fireLast: true, delay: 100});

    chai.assert(hasHappened === false, 'error: callback has called');
    fn();
    chai.assert(hasHappened === false, 'error: callback has called');
  });

如果你知道一堆测试用例那就很好，所以我可以看到我的错误。

Answer 1

我终于found解决了sinon的越野车计时器，因为他们在内部覆盖了Date对象，setTimeout()，setInterval()等。

这里的问题是，我们是否愿意更改我们的代码，以便在我们的代码中改变测试或更糟糕的集成测试条件。

解决方案是用...启动计时器！

/*** file 'g3.debounceTest.js' ***/
describe('g3.debounce', function() {
  it('should not run debounced function with: 1 call at elapsed < delay & fireLast: true', function() { 
    var clock = sinon.useFakeTimers();
    // sinon remedy avoids buggy behavior
    clock.tick(1000);
    //console.log(Date.now());
    var delay = 100;
    var spy = sinon.spy();
    var targetFn = function(){console.log('eventually debounced was called!'); spy()};
    var delayedFn = g3.debounce(targetFn, {delay: delay, fireFirst: false, fireLast: true});
    // for lodash:
    //var delayedFn = _.debounce(targetFn, delay, {leading: false, trailing: true});
    delayedFn();
    clock.tick(delay - 1);
    //console.log(Date.now());
    clock.restore(); 
    sinon.assert.notCalled(spy); 
  });

  it('should run debounced function once with: 1 call at elapsed < delay & fireFirst: true', function() { 
    var clock = sinon.useFakeTimers();
    // sinon remedy avoids buggy behavior
    clock.tick(1000);
    //console.log(Date.now());
    var delay = 100;
    var spy = sinon.spy();
    var targetFn = function(){console.log('eventually debounced was called!'); spy()};
    var delayedFn = g3.debounce(targetFn, {delay: delay, fireFirst: true, fireLast: false});
    // for lodash:
    //var delayedFn = _.debounce(targetFn, delay, {leading: true, trailing: false});
    delayedFn();
    clock.tick(delay - 1);
    //console.log(Date.now());
    clock.restore(); 
    sinon.assert.calledOnce(spy); 
  });

  it('should run debounced function once with: 3 calls at elapsed < delay & fireFirst: true', function() { 
    var clock = sinon.useFakeTimers();
    // sinon remedy avoids buggy behavior
    clock.tick(1000);
    //console.log(Date.now());
    var delay = 100;
    var spy = sinon.spy();
    var targetFn = function(){console.log('eventually debounced was called!'); spy()};
    var delayedFn = g3.debounce(targetFn, {delay: delay, fireFirst: true, fireLast: false});
    // for lodash:
    //var delayedFn = _.debounce(targetFn, delay, {leading: true, trailing: false});
    /* 1 */delayedFn();
    /* after 99ms */
    clock.tick(delay - 1);
    //console.log(Date.now());
    /* 2 */delayedFn();
     /* after 99ms */
    clock.tick(delay - 1);
    //console.log(Date.now());
    /* 3 */delayedFn();
    clock.restore(); 
    sinon.assert.calledOnce(spy); 
  });

  it('should run debounced function once with: 3 calls at elapsed < delay & fireLast: true', function() { 
    var clock = sinon.useFakeTimers();
    // sinon remedy avoids buggy behavior
    clock.tick(1000);
    //console.log(Date.now());
    var delay = 100;
    var spy = sinon.spy();
    var targetFn = function(){console.log('eventually debounced was called!'); spy()};
    var delayedFn = g3.debounce(targetFn, {delay: delay, fireFirst: false, fireLast: true});
    // for lodash:
    //var delayedFn = _.debounce(targetFn, delay, {leading: true, trailing: false});
    /* 1 */delayedFn();
    /* after 99ms */
    clock.tick(delay - 1);
    //console.log(Date.now());
    /* 2 */delayedFn();
     /* after 99ms */
    clock.tick(delay - 1);
    //console.log(Date.now());
    /* 3 */delayedFn();
    /* after 100ms */
    clock.tick(delay);
    clock.restore();
    sinon.assert.calledOnce(spy);
  });
});
/***end file 'g3.debounceTest.js' ***/

我还在回调中注入了一个spy()，因为我想看看回调会发生什么，我惊讶地发现回调在我们调用clock.restore();之后运行，但是sinon没有办法审计这个并且仍然完全不知道在clock.restore();之后发生了什么。

这就是为什么我被迫在最后一种情况下编写clock.tick(delay);以便让sinon“看到”最后一次调用的原因。

最后，如果你有更多的想法来测试这样的异步代码，我很乐意看到它们。