JavaScript重構之JavaScript的測試

來源: CSDN 發布時間: 2011-06-08 13:14 閱讀: 1682 次推薦: 0 原文鏈接 [收藏]

摘要：進行JavaScript重構時，我希望引入易于使用的測試框架來保證重構的順利進行，未來能持續通過測試代碼對JavaScript邏輯的正確性做保障。

　　進行JavaScript重構時，我希望引入易于使用的測試框架來保證重構的順利進行，未來能持續通過測試代碼對JavaScript邏輯的正確性做保障。

　　JsUnit （http://sourceforge.net/projects/jsunit/，http://www.jsunit.net/）

　　JsUnit是一個獨立的JavaScript單元測試框架，和JUnit差不多，沒有上手難度，包括傳統的setUp和tearDown，提供的assert方法也和JUnit類似，多了assertNaN和assertUndefined等等JavaScript特有的方法。測試頁面必須在head里面引入jsUnitCore.js這個js文件。

　　測試套件的支持：提供了addTestPage和addTestSuite；

　　測試日志的支持：包括warn、info和debug三種日志級別，前端編碼不似后臺代碼，正式代碼中不宜使用過多log，再說log也只有FF下才支持，現在好了，在測試代碼里盡情打吧。

　　千言萬語不及一個例子：

script language="javascript" src="jsUnitCore.js"/script
script language="javascript" src="play.js"/script //模塊JS

function testWithMainProcess() {
assertEquals("Web play url", "##http://...##", webOnlinePlay());
}

項目的代碼里到處是Ajax調用，要做單元測試，看來打樁是不可避免了。Mock類的工具有許多，比如適合JQuery的QMock：

var mockJquery = new Mock();
mockJquery
.expects(1)
.method('ajax')
.withArguments({
url: 'http://xxx,
success: Function,
dataType: "jsonp"
})
.callFunctionWith({ feed : { entry : "data response" }});

　　這個樁正是mock了一個假的ajax jason返回：[feed:[entry:"data response"]]，看看，使用就和以前接觸過的EasyMock差不多嘛。

　　對于JavaScript測試框架感興趣的同學還可以了解一些其他的測試框架，例如JSpec。

　　單元測試代碼建議就放在模塊的包內：test.html，即便理想狀況下，模塊單獨發布時，也是伴隨著測試用例的可靠的前端代碼。

　　從哪些JavaScript代碼開始做？

　　1、函數式的代碼。這樣的代碼保證獨立性好，也不需要打什么樁，測試成本低。

　　2、復雜的邏輯。

　　是否嘗試TDD？不建議在我們團隊內部使用，前端TDD需要更高的技巧，對人的因素要求更高。如果有一天，后臺Java代碼的TDD做好了，那么換成JavaScript的代碼，沒有本質區別。

　　如果效果得當，為什么不能把JavaScript的UT集成到ICP-CI上作為持續集成的一部分呢？

標簽：JavaScript