Question

我在下方有一个javascript，会在页面加载时附加DIV并在3秒后隐藏它。

var testObj = {
   initialize: function() {
    var that = this;
    $(window).on("load", function() {  
        (function ($) { //Append Div
            $('body').append("<div>TEST</div>");
        })(jQuery);
        that.hideAppendedDiv();
    });
   },
   hideAppendedDiv: function() {  //Hide appended Div after 3s
    setTimeout(function(){
        $("div").hide();
    }, 3000);
   }
};

//call Initialize method
testObj.initialize();

如何为代码中的方法编写Jasmine测试用例。

Answer 1

您不需要测试窗口加载事件，如果您将附加代码移出匿名函数调用并将其传递给事件处理程序，则可以完全按照与任何操作相同的方式测试功能否则你的代码会更好。

Answer 2

我猜你真的不想测试一个Javascript函数，比如$(window).on('load')...，但你自己的函数hideAppendedDiv()是从$（window）调用的.on（'load' ）。此外，您希望确保函数hideAppendedDiv()也能正常工作。

IMO，你需要两个期待。

在每个功能之前的设置中某处：

beforeEach(function () {
    spyOn(testObj , 'hideAppendedDiv').and.callThrough();
});

<强>期望

it('expects hideAppendedDiv() to have been called', function () {

    // make the call to the initialize function
    testObj.initialize ();

    // Check internal function
    expect(testObj.hideAppendedDiv).toHaveBeenCalled();
});

it('expects hideAppendedDiv() to hide div', function () {

    // make the call to the hideAppendedDiv function
    testObj.hideAppendedDiv();

    // Check behavior
    expect(... check the div ...) 
});

修改

为了清楚起见，Jasmine按顺序执行所有预期。现在，如果你有两个函数fn_1()和fn_2()，并且你想测试它们是否被调用，你可以设置另一个返回特定值的spi函数，或者顺序和增量集合每次调用它时的值。

beforeEach(function () { spyOn(testObj , 'fn_1').and.returnValues(1, 2, 3); spyOn(testObj , 'fn_2').and.returnValues(4, 5, 6); });

第一次调用fn_1时，它将返回1，fn_2将返回4。

这只是其中一种方法，但您必须在测试时发挥创意。

现在，如果您想测试在x时间here之后调用函数的帖子已经解释了它。

如何测试$（window）.on中的代码（＆＃34; load＆＃34;，function（）{}）;在茉莉花

2 个答案: