尽管StackOverflow上有two个相关的questions,但我还没有找到一个令人满意的答案,所以我发帖是为了找出Jasmine-jQuery中是否有一个公认的最佳实践用户。
基本问题很简单,两个相关问题涵盖了两个例子:
在我的Javascript中,有一个setup()
函数将事件处理程序绑定到页面上的各种选择器,如$('#someDiv').click(someHandler)
;此函数传递给$(document).ready
在我的Jasmine测试中,我使用代表页面各个提取部分的HTML工具来测试这些元素上的AJAX交互(我正在运行jasmine-rails“服务器”版本,在那里你可以查看Jasmine测试报告在浏览器中)
问题当然是setup()
尝试绑定处理程序的选择器在加载夹具之后才会存在。因此,在Jasmine测试中显式触发的事件将不会被fixture中的DOM元素拾取,因为绑定该处理程序的函数已经在$(document).ready
时间运行。
如果只有茉莉花能够以某种方式延迟调用$(document).ready
,直到灯具装满之后,我才会成为金色。但显然它不能。
从上面的两个StackOverflow问题中,我已经收集了各种方法来解决这个问题,但都不尽如人意:
将setup
中的绑定代码复制到HTML fixture中。这是非DRY,几乎肯定会导致灯具与现实不同步,加上灯具应该代表不显眼的JS,因此不会混合代码和标记。
在需要它的测试用例中显式调用setup
函数。这在简单的情况下有效,但如果setup
做了非幂等的事情,则会失败。
在setup
中,使用$(document).on('click', '#someDiv', someHandler)
之类的内容,而不是上面显示的代码。 (我在jQuery 1.10.1上。)我实际尝试了这个但它不起作用:即使加载的fixture包含匹配#someDiv
的元素,触发该元素的'click'也不会导致{ {1}}被召唤。即使它确实有效,它也很混乱,因为(如果我理解的话)调用处理程序时someHandler
的值将反映实际处理事件的元素,而不一定是首先接收它的元素。
在this
中,使用setup
之类的内容,但自jQuery 1.7起已将$('#someDiv').live(someHandler)
弃用,并在1.9中删除。
我是否还缺少一些其他方法,不需要仅仅为了适应测试环境而修改工作代码而且不需要违反DRY?
答案 0 :(得分:1)
我有一个使用jasmine-jquery here使用Jasmine进行DOM操作的示例。您还将在其中的说明中看到一个链接到您可以克隆的github仓库,以便更深入地了解SpecRunner.html如何订购依赖项。基本上我有我的html灯具和他们的onclick事件,然后是我的jasmine beforeEach()中的jquery click()。然后,我的测试期望也检查DOM进行验证。这可能与您上面的#2解决方法有关。