javascript - Jasmine 测试元素是否淡出

Question

我正在为以下两个函数编写一些 Jasmine 测试:

var showSpinner = function () {
    $('#spinner').remove();
    $('<div id="spinner"><i class="fa fa-spinner fa-pulse fa-3x fa-fw"></i></div>')
        .appendTo('body')
        .hide()
        .fadeIn();
};

var hideSpinner = function () {
    $('#spinner').fadeOut(function () {
        $(this).remove();
    });
};

我的测试如下:

it('show spinner', function () {
    showSpinner();
    expect($('#spinner').length).toEqual(1);
});

it('hide spinner', function () {
    hideSpinner();
    expect($('#spinner').length).toEqual(0);
});

第一个测试工作正常。但是，由于 hideSpinner 上的 fadeOut，第二次测试失败。

我尝试修改它以使用超时，例如

it('hide spinner', function () {
    hideSpinner();
    setTimeout(function () {
        expect($('#spinner').length).toEqual(0);
    }, 100);
});

但这会导致测试通过，但会出现没有预期的警告...

我该如何测试这个？

Answer 1

您应该阅读 Jasmine's Asynchronous Support :

it('hide spinner', function(done) {
    hideSpinner();
    setTimeout(function() {
        expect($('#spinner').length).toEqual(0);
        done();
    }, 400);
});

400 毫秒是 $.fadeOut 的默认超时.