如何对自定义AJAX事件进行单元测试

我有一个JavaScript应用程序，用户可以在其中搜索地图上显示的位置。搜索位置是通过对服务器应用程序的AJAX调用完成的。有一个组件负责此服务器通信（searchComponent），我想单元测试通信是否正常工作。自定义事件如何对自定义AJAX事件进行单元测试

我的自定义事件的

说明是从http://api.jquery.com/jQuery.Callbacks/采取了简单的发布/订阅的实现：

var topics = {}; jQuery.Topic = function(id) { var callbacks, method, topic = id && topics[ id ]; if (!topic) { callbacks = jQuery.Callbacks(); topic = { publish: callbacks.fire, subscribe: callbacks.add, unsubscribe: callbacks.remove }; if (id) { topics[ id ] = topic; } } return topic; };

最重要的方法是

EVENT.publish(data)
Trigg发生事件并将数据传递给所有订阅者。

EVENT.subscribe(callback) 将回调函数订阅给EVENT：每当EVENT被触发时执行回调函数。

使用情况

的基本工作流程是这样的：

用户点击搜索按钮

应用程序调用searchComponent.doSearch()

searchComponent.doSearch()发送请求到服务器

服务器r esponds

的SearchComponent触发定制事件任SEARCH_RESULT或SEARCH_FAILED

应用侦听两个事件，并从那里继续进行（显示的东西在地图上或产生错误消息）

SEARCH_RESULT和SEARCH_FAILED是如上所述的自定义事件。

var SEARCH_RESULT = jQuery.Topic('SEARCH_RESULT'); var SEARCH_FAILED = jQuery.Topic('SEARCH_FAILED');

我想要做什么？

我要测试是否SearchComponent的工作：

是对服务器的请求被正确地进行？

来自服务器的响应是否正确处理？

当我拨打无效呼叫时，搜索失败吗？

服务器关闭时会发生什么情况？

通常的东西。;）

问题（最后;））

如何测试这个用例？
（最好使用JS测试驱动程序，虽然我是开放对其他JavaScript测试框架的任何建议）

来源

2013-04-26 Friederike

这是可能使用[AsyncTestCase] [1] JS测试来测试异步行为-driver。

下面是doSearch（）方法的示例测试用例。我已经添加了评论来解释测试的每个部分在做什么。

MyTest = AsyncTestCase("MyTest", { 

testSearchGoodCase : function(queue) { 
    // this flag will only be set to true when SEARCH_RESULT 
    // is triggered (see STEP 1) 
    var resultReceived = false; 

    // STEP 1 
    queue.call('prepare callbacks', function(callbacks) { 

     // add event handler for the desired behaviour 
     var onExpectedBehaviour = callbacks.add(function() { 
      // when this method is called the queue will enter STEP 2 
      resultReceived = true; 
     }); 

     SEARCH_RESULT.subscribe(onExpectedBehaviour); 

     // What if our test-method is not working and an error occurs? 
     // Then the SEARCH_FAILED event is triggered, but for this 
     // test case that is an error. So we can add the onError method 
     // as an errback in js-test-driver. 

     // errbacks cause the test to fail with a custom message. 
     var onError = callbacks.addErrback('Received an error.'); 

     // When SEARCH_FAILED is triggered onError is called 
     // -> that will cause the test to fail 
     // with the error message "Received an error". 
     SEARCH_FAILED.subscribe(onError); 

     // Now everything is set up and we can execute the function 
     // that we want to test. 
     searchComponent.doSearch(); 

     // The test will then run until either SEARCH_RESULT 
     // or SEARCH_FAILED is triggered. Or the test will 
     // timeout (if none of the two events is triggered). 
    }); 

    // STEP 2 
    queue.call('check conditions after asynchronous method completed', function() { 

     // when we get here the doSearch() method completed 
     // its asynchronous task. 
     assertTrue(resultReceived); 

    });   
} 
}

来源

2013-04-26 13:05:22 Friederike

如何对自定义AJAX事件进行单元测试

回答

相关问题