如何用Jasmine模拟JQuery?
问题描述:
我如何测试某个JQuery选择器是否已经与Jasmine一起执行?我试图做到以下几点:如何用Jasmine模拟JQuery?
spyOn($.fn, 'init').andCallThrough();
// my code
expect($.init).toHaveBeenCalled();
但这个电话后,$('div')
回报Object { selector="div", context=document, NaN=div.spec, more...}
,虽然它返回(和$.fn.init('div')
不会返回它):[div.jasmine_reporter, div.banner, div.logo, 4 more...]
。由于JQuery对象不再可用,这些东西自然会破坏代码。
例子:
说我想测试一个jQuery选择被调用,我写:
it('tests', function() {
spyOn($.fn, 'init').andCallThrough();
$('html');
expect($.init).toHaveBeenCalled();
});
这个结果从茉莉花错误:Error: Expected a spy, but got undefined.
。然后,我在Firebug上$(“HTML”)行设置断点,当我到达那里,试图看,什么$('html')
值,我得到:
Object { selector="html", context=document, NaN=html, more...}
如果我注释掉spyOn
,对线$('html')
计算结果为:
[html]
这是我期待与spyOn
看为好。
答
那么它看起来像茉莉它通过替换的间谍东西暗中监视,与包装版本的对象,这似乎是搞乱了的jQuery作为一个整体,因为(从jQuery源代码):
// jQuery对象实际上只是在init构造“加强”
我建议试图刺探的init使用的功能之一,特别是“合并”。如果你看一下jQuery的代码,你会发现任何HTML => DOM的东西最终获得通过合并调用返回:
return jQuery.merge(this, selector);
(这是行152,如果你碰巧在看的jQuery 1.5的源0.1)。
通过监视合并,您应该能够测试您正在测试的任何内容,而不会无意中替换jQuery的内容。
你可以提供你的代码为spyOn和期待?另外,你的最后一段有点难以理解。你可以试着扩大/澄清它吗? – machineghost
@machineghost,增加了一个例子,希望它有帮助 – Fluffy
嗯,你试过期待($ .fn.init).toHaveBeenCalled(); ? – machineghost