適合你React項目的JavaScript測試工具,有哪些?
“信任是必須的,但核實也是必要的。”
里根總統帶火的一個俄羅斯習語非常符合我們談論測試和QA時的情境。
每個人都信任自己,每個程序員或開發人員都信任代碼。但為什么我們不能“完全信任”他們呢?
因為在編程領域,即便是極小的一個錯誤也會造成很大很大的損失,這就是為什么我們要反復進行測試與驗證的根本原因之一。
前端開發的生態系統正在不斷進步并且沒有簡單一絲一毫。如今的公司在招聘精通各自領域的前端開發人員時競爭激烈。這錯綜復雜的事物則有逐年倍難的趨勢。
來看一些在React.js項目上有所幫助的工具。
首先是選擇JavaScript測試執行過程管理平臺。測試執行過程管理平臺是測試堆棧中不可分割的一部分。作為一個ReactJs研發公司發展過程中的一部分,我們可以看到開發人員借助Karma在一個或多個瀏覽器中同時進行測試。測試執行過程管理平臺有助于分析代碼是否安全,避免受瀏覽器怪癖的影響,通常比其他解決方案更加值得信賴。它也可以用來配置使用SauceLabs和BrowserStack這樣的的遠程服務。
另一個簡單易用的選擇是 Mocha CLI。Mocha CLI令人相當滿意,因為它可以在Node.js環境中輕松運行Mocha tests。遺憾的是,不存在使用Mocha CLI 在瀏覽器中運行測試的機制。
如果想執行跨瀏覽器測試或者測試重要的DOM操作,請選擇Karma。或者將默認的CLI和其他工具庫(如Enzyme和JSDOM)結合使用。
JavaScript框架
請確保你的測試框架對異步代碼和同步代碼都支持測試并且使其便于關閉測試。Jasmine、Mocha、和Jest都滿足這些要求。
Jasmine是一個行為驅動的開發框架,用于測試JavaScript代碼; 它不依賴于任何其他的JavaScript框架,也不需要DOM,而且它具有簡潔清晰的語法可以讓你輕松地編寫測試代碼。
下列是Jasmine的一些示例代碼。

Jasmine擁有斷言功能, 被稱之為matchers,其內置在Jasmine中。這些斷言消除了涵蓋外部斷言庫(如Chai和Should.js)的必要性,還能夠模擬函數以從作用域中刪除一些依存樹。
Facebook的測試框架Jest,專為React設計。Jest很好地響應了基本的測試需求,但是今天的亮點是快照測試。它允許你序列化組件的輸出并且保存,同時輕松檢測出序列何時發生更改。快照是保存到源代碼管理中的文本文件并且快照要與未來運行的測試進行對比。
此外,像Jasmine一樣,Jest還提供基本的斷言和模擬功能。

回到Mocha上來,它專注于成為一個可靠的測試框架。它看上去既沒有斷言庫也不能做類型奇特的測試。然而,能做之事,它做得都不錯。
如果選擇Mocha,就意味著還必須專門選擇斷言庫和mocking庫。這種情況下,你大概只能使用Chai和Sinon.js了。如果想尋求更多的選擇,有一個關于Mocha的維基頁面 概述了一些常見的選擇。
在這種情況下,如果沒有特殊偏好,Jest 或Jasmine應該是首選。盡管Jest 是一個通用的JavaScript測試框架,但快照測試功能僅限于React組件。
測試附加組件
如果要在組件上執行淺渲染和斷言,有兩個選擇:
- React-test renderer 用于淺渲染。
- React-test-utils 用于斷言。
另外一個選擇是愛彼迎公司的工具庫Enzyme。它是為React設計的測試工具,方便判斷、操縱和遍歷React組件的輸出。
還有一個選擇是使用 Sinon.js,一個帶有詳細斷言的強大mocking庫。它還提供了一個很好的時鐘模擬裝置而且容易模擬AJAX的請求。
靈活運用這些JS測試工具,讓你的項目更具信服力吧!