如何在karma angularjs中对setInterval进行单元测试

Question

app.directive('shuffleBlocks', function($timeout){
    return {
        link: function(sco,ele,att){
            if (itemCnt <= 1) return;

            /*Trigger function*/
            function triggerEvent(){
                ...
            }
            ele.bind('click', triggerEvent);

            setInterval(triggerEvent, 5000);
        }
    }
})

在这里我写了测试

        var elem = '<div shuffle-blocks><div>';
        elem = mockCompile(elem)(rootScope.$new());
        setInterval(function(){
            expect(......).toBe(....)
        });

显然这不是正确的方法,有没有人知道如何在业力中测试$ timeout和setInterval？

Answer 1

更新:在角度1.2+应用程序中模拟setInterval的正确方法是使用angular的$interval服务.使用该$interval服务提供了许多好处,但在这种情况下最常用的$interval.flush()方法之一是该方法.在编写测试时,会$interval公开一种.flush()允许您模拟JS时钟的方法.

app.directive('shuffleBlocks', function($timeout, $interval){
    return {
        link: function(sco,ele,att){
            if (itemCnt <= 1) return;

            /*Trigger function*/
            function triggerEvent(){ ... }
            ele.bind('click', triggerEvent);

            $interval(triggerEvent, 5000);
        }
    }
});

然后在你的单元测试中:

var elem = '<div shuffle-blocks><div>';
elem = mockCompile(elem)(rootScope.$new());
$interval.flush(5000); // flush accepts the # of ms to be flushed
expect(......).toBe(....);

希望对将来查找此答案的任何人都有帮助.对于那些仍在使用1.1X的人,我会留下我之前的答案.

上一个答案:根据茉莉花文档,您应该能够使用该jasmine.Clock.useMock()函数来模拟典型的javascript时钟并在整个时间间隔内手动操作.由于angular只是包装了原生setTimeout函数,所以我非常肯定它应该允许这个工作,虽然我没有测试它确定.

版本1.3的茉莉花文档在这里.这是演示其工作原理的代码示例.

beforeEach(function() {
    timerCallback = jasmine.createSpy('timerCallback');
    jasmine.Clock.useMock();
});

it("causes a timeout to be called synchronously", function() {
    setTimeout(function() {
        timerCallback();
    }, 100);

    expect(timerCallback).not.toHaveBeenCalled();

    jasmine.Clock.tick(101);

    expect(timerCallback).toHaveBeenCalled();
});

我看到的唯一问题是你的triggerEvent()函数是你的链接函数的本地函数,所以我不知道你将如何去模拟它.但希望这能指出你正确的方向.如果没有,抱歉,我试过了.

更新:模拟时钟的语法已经改变了Jasmine 2.0.如果您使用的是2.0,请在此处查看更新的文档.