如何在$（window）.on（“load”，function（）{}）中测试代码; 在Jasmine

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

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

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

Answer 1

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

IMO，你需要两个期望。

在您的设置之前的某个地方，每个function：

 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时间之后被调用的，那么这个post已经解释了它。

Answer 2

您不需要测试窗口加载事件，如果您将附加代码移出匿名函数调用并将其传递到事件处理程序中，您可以使用与其他任何内容完全相同的方式测试function，并且您的代码将结构更好。