前端測試（2）--QUnit

一、簡介

QUnit是前端單元測試的框架，與java的JUnit類似，首先安裝QUnit，有三種方式：

• 官網下載源文件
• 引用CDN
• 使用 bower 安裝( bower install --save-dev qunit ) 或 使用npm安裝( npm install --save-dev qunitjs )

二、經常使用代碼簡介

2.1 開始測試

QUnit.test( name, expected, test ) ：一個常規的測試用例。測試用例名、期待斷言數、測試內容（通常是一個function）。

QUnit.asyncTest( name, expected, test ) ：一個異步測試用例。默認的test都是同步的。內容中必須顯示地調用start()，測試纔會開始。

QUnit.module( name, lifecycle ) ：定義一個名爲name的模塊。在可選參數lifecycle中，能夠定義模塊開始和結束的測試內容。具體見文檔。

QUnit.init( ) ：啓動QUnit測試。若是測試在進行中，則會從新啓動。基本不用。

2.2 QUnit斷言方法

assert.ok( state, message ) ：真假斷言，state爲true則經過。相似於JUnit的assertTrue。

assert.equal( actual, expected, message ) ：相等斷言，actual和expected相等（==）則經過。相似於JUnit的assertEquals。
assert.notEqual( actual, expected, message )不等斷言，actual和expected不相等（!=）則經過。相似於JUnit的assertNotEquals。

assert.deepEqual( actual, expected, message )遞歸相等斷言，actual和expected全相等（包括其子元素都相等，適用於基本類型，數組和對象）則經過。對於基本類型，至關於strictEqual,能夠經過{key : value}是否相等比較兩個對象是否相等。
assert.notDeepEqual( actual, expected, message )遞歸不相等斷言，actual和expected不全相等（包括其子元素都相等，適用於基本類型，數組和對象）則經過。對於基本類型，至關於notStrictEqual。

assert.strictEqual( actual, expected, message )全相等斷言，actual和expected全相等（===）則經過。
assert.notStrictEqual( actual, expected, message )不全相等斷言，actual和expected不全相等（===）則經過。

assert.propEqual(value, expected[, message]) 比較真實和期待（expected ）的對象的屬性和屬性值是否相同，相同斷言經過，注意這個方法能夠比較構造函數和原型不一樣的兩個對象
assert.notPropEqual(value, expected[, message]) 與propEqual相反。

assert.expect( amount )本測試裏期待會執行amount個斷言，大於或少於這個數量，測試都將失敗。

assert.raises( block, expected, message )異常斷言，block中拋出異常則經過，expected爲可選參數，是所期待拋出異常名的正則表達式。

2.3 把QUnit集成到現有工具

QUnit在執行的過程當中會調用一系列函數，告知外界運行情況，你們能夠覆蓋這些函數，達到集成的目的。

QUnit.begin()當QUnit開始時會調用此函數。
QUnit.done()當QUnit結束後會調用此函數。

QUnit.moduleStart({ name })每當一個模塊執行開始時會調用此函數。
QUnit.moduleDone({ name, failed, passed, total })每當一個模塊執行結束後會調用此函數。

QUnit.testStart({ name })：測試執行開始時會調用此函數。
QUnit.testDone({ name, failed, passed, total })每當一個測試執行結束後會調用此函數。

QUnit.log({ result, actual, expected, message })：斷言執行結束後會調用此函數。

在後面的實例中，我寫了一些覆蓋，打印了執行過程。相信有了這些回調函數的幫助，寫一個進度條出來也不是難事。

2.4 QUnit的過濾器

• Hide passed tests：隱藏經過的測試，勾選後經過的測試就不顯示。使用了HTML5的sessionStorage技術，頁面從新載入的時候只測試以前那部分沒有經過的case。
• Check for Globals：」全局檢查「，若是勾選了這項，在進行測試以前，QUnit會檢查測試以前和測試以後window對象中的屬性，若是先後不同，就會顯示不經過。
• No try-catch： QUnit不使用try-catch跑測試，當有異常拋出的時候，測試運行器會中止運行，但會得到一個內部異常，在咱們使用老瀏覽器（例如ie6）作測試的時候會有幫助。
• Rerun：從新測試該用例
• Enable coverage：查看測試代碼的覆蓋率，須要引入文件sap.ui.qunit.qunit-coverage

2.5 QUnit Test對象

QUnit的每一個test函數都會生成Test類相應的實例，每一個實例都5個生命週期，每一個Test實例的生命週期方法都會順序加入config.queue中順序執行，生命週期以下：

• init
• setup
• run函數負責運行正真的測試代碼
• teardown
• finish負責將統計好的測試結果顯示到頁面上

若是run中有異步的代碼，順序執行run、teardown和finish以後，異步代碼還沒執行，其測試的結果就沒法正確統計。 所以應調用Qunit.start()和Qunit. stop()函數，分別設置config.blocking true或者false來控制執行隊列暫停或執行，從而等待異步代碼執行，正確統計執行結果。

更多API參考官網文檔：https://qunitjs.com/