使用 Jasmine 测试原型自定义事件

Question

我为那些仍然使用 PrototypeJS 并希望使用 jasmine 和 jasmine-prototype 插件测试自定义事件的人发布这个。

我们会根据用户点击或表单提交情况触发自定义事件。我们需要一种简单的方法来测试自定义事件是否正确触发。

下面是一个示例：

var CustomEventsDispatcher = ( function() {
   function init(){
    //if elements exists
    if($$('a.trigger_bomb')) {
        // Observe the elements
        $$(elements).each(function(element) {
            element.observe('click', function(e) {
                this.fire("bomb:explode", {})
            });
        });
    }

    return {'init' : init};
 })();

利用网络上可用的资源，我创建了一个灯具......

 // spec/fixtures/links.html
 <a class="trigger_bomb" href="#"> Trigger Bomb </a>

。和测试套件：

  //spec/trigger_bomb_spec.js
 describe("Trigger Bombs", function() {
    beforeEach(function(){
       loadFixtures("links.html")
       CustomEventsDispatcher.init();
   })
   it("should raise the custom event", function(){
      var element=$$('a.trigger_bomb').first();
      spyOnEvent(element, 'click');
      element.click();
      expect('click').toHaveBeenTriggeredOn(element);
      expect('bomb:explode').toHaveBeenTriggeredOn(element);
   });
 }); 

第一个断言

工作正常，但第二个断言无效。原因是spyOnEvent改变了在element上处理点击事件的方式。

Answer 1

最简单的方法是像这样模拟fire函数：

  //spec/trigger_bomb_spec.js
 describe("Trigger Bombs", function() {
    beforeEach(function(){
       loadFixtures("links.html")
       CustomEventsDispatcher.init();
   })
   it("should raise the custom event", function(){
      var element=$$('a.trigger_bomb').first();
        spyOn(element, 'fire')
        element.click()
        expect(element.fire).toHaveBeenCalledWith('bomb:explode', {})
   });
 }); 

但是，此解决方案有一个副作用：将执行单击，这将导致茉莉花页面结果不断重新加载。您需要拦截点击事件并使用全局beforeEach挂钩停止默认行为：

// spec/helpers/spec_helper.js
beforeEach(function(){
    // stop all clicks from fixtures 
    // (but allow clicks from the user in the jasmine result page)
    document.observe('click', function(e){
        var element = e.findElement('#HTMLReporter')
        if (element == document)   {
            Event.stop(e)
        }
    })             
})

希望这将帮助某人节省几个小时的调试:)。随意评论/改进/提出更好的选择。