vue cli 擁有開箱即用的通過 Jest 或 Mocha 進行單元測試的內置選項。
由於mocha單元測試集合在vue cli下有問題,可以使用 jest 來完成單元測試。
語法:
普通匹配器:
tobe : 是否精確匹配
toBe用的是 js 中的 Object.is() ,屬於ES6中的特性,所以不能檢測對象,如果要檢測對象的值的話,需要用到 toEqual 。
toEquel : 遞歸檢查對象或者數組中的每個字段。
- toBeNull只匹配null
- toBeUndefined只匹配undefined
- toBeDefine與toBeUndefined相反
- toBeTruthy匹配任何if語句爲真
- toBeFalsy匹配任何if語句爲假
數字匹配器:
大多數的比較數字有等價的匹配器。
- 大於。toBeGreaterThan()
- 大於或者等於。toBeGreaterThanOrEqual()
- 小於。toBeLessThan()
- 小於或等於。toBeLessThanOrEqual()
- toBe和toEqual同樣適用於數字
注意:對比兩個浮點數是否相等的時候,使用toBeCloseTo而不是toEqual
如:
如果使用toBe就會產生以下結果:
字符串
使用toMatch()測試字符串,傳遞的參數是正則表達式。
數組
如何檢測數組中是否包含特定某一項?可以使用toContain()
另外
如果你想在測試特定函數的時候拋出一個錯誤,在它調用的時候可以使用toThrow。
測試異步代碼
在實際開發過程中,我們經常會遇到一些異步的JavaScript代碼。當你有以異步方式運行的代碼的時候,Jest需要知道當前它測試的代碼是否已經完成,然後它可以轉移動另一個測試。也就是說,
測試用例一定要在測試對象結束之後才能夠結束
爲了達到這一目的,Jest有多種方法可以做到。
回調
最常見的異步模式就是回調函數。
注意:回調函數和異步沒有必然的聯繫,回調只是異步的一種調用方式
Promise
接受promise 時
拒絕promise 時
Async/Await
爲多次測試重複設置
如果你有一些要爲多次測試重複設置的工作,可以使用beforeEach和afterEach。
有這樣一個需求,需要我們在每個測試之前調用方法initializeCityDatabase(),在每個測試後,調用方法clearCityDatabase()
一次性設置
在某些情況下,你只需要在文件的開頭做一次設置。這種設置是異步行爲的時候,你不太可能一行處理它。Jest提供了beforeAll和afterAll處理這種情況。
作用域
默認情況下,before和after的塊可以應用到文件中的每一個測試。
此外可以通過describe塊來將將測試中的某一塊進行分組。
當before和after的塊在describe塊內部的時候,則只適用於該describe塊內的測試。
比如說,我們不僅有一個城市的數據庫,還有一個食品數據庫。我們可以爲不同的測試做不同的設置︰
注意:頂級的beforeEach描述塊內的beforeEach之前執行,以下的例子可以方便我們認識到執行的順序