初學JavaScript測試框架Mocha,和斷言庫Chai

初學JavaScript測試框架Mocha,和斷言庫Chai

在github上的案例

環境配置: vscode

官方網站介紹

Mocha is a feature-rich JavaScript test framework running on Node.js and in the browser, making asynchronous testing simple and fun. Mocha tests run serially, allowing for flexible and accurate reporting, while mapping uncaught exceptions to the correct test cases. Hosted on Github. 我簡單理解一下。Mocha是一個JS測試框架,運行在Node.js和瀏覽器中,讓異步測試變得簡單有趣。當映射未捕獲的異常到正確的測試案例,考慮到allowing for靈活和精確的報告, Mocha測試連續地serially運行。

看一下放到github上的文檔

在文檔中想找可以直接使用cdn然後用<script>在瀏覽器中運行這種,看一下這個Running Mocha in teh Browser,但是主要用npm來安裝mocha包。

首先安裝,文檔寫到

$ npm install mocha
$ mkdir test
$ $EDITOR test/test.js # or open with your favorite editor

這裏我是用的是vscode,所以默認這個$EDITOR應該就是“code",我在終端輸入code test/test.js,這個會在這vscode工具中test文件夾裏創建一個test.js文件。至於後面這個”#“是什麼意思,我也沒弄明白,可能只是註釋的意思吧。其實我之前想這是不是向文件裏寫內容呢,然而測試的時候並不是這樣。

在終端要輸入./node_modules/mocha/bin/mocha,就會運行,mocha會自動執行根目錄下test文件夾下的文件test.js。這裏有個誤區,記得不是像這樣node test/test.js用。

其實看到下面的案例,我也懵了

var assert = require('assert');
describe('Array', function() {
  describe('#indexOf()', function() {
    it('should return -1 when the value is not present', function() {
      assert.equal([1, 2, 3].indexOf(4), -1);
    });
  });
});

什麼是describe?中文意思是描述,形容的意思。這個方法describe()中第一個參數看起來也沒什麼實際意義,就是描述一下正在做的事。如果這裏我們在做的是和Array相關的事。然後第二個參數回調函數裏面繼續嵌套一個describe()方法,所以這個可以不停的嵌套。

至於這個describe()方法在哪來的,官方文檔也找不到說明,也沒有解釋。可以看一下這個文章A guide to mocha’s describe(), it() and setup hooks, 然後在stackoverflow中看到這篇文章What is describe() in Mocha,可以理解,這世上有一種東西叫做規範。大家都遵循規範做事。然後這個"#indexOf()"中的#是指當涉及一個方法的名字時用。不過看官方文檔中的INTERFACES-BDD,指出這個BDD接口interface提供了describe(), it()。那什麼是BDD?google一下,Behaviour-Driven Development行爲驅動開發,這個大家有興趣自己看一下。

it()方法又是什麼意思?中文意思是它。所以describe+it大概理解稱是描述一下它。不過it裏面的和describe就有些不一樣了。it是真實的測試一個實例。回調函數中是要測試的內容,第一個參數是描述這個測試的內容要達成什麼樣的結果。

assert中文意思是斷言,聲稱,主張的意思,也可查google一個詞彙和wikipedia中的解釋。舉個列子我assert斷言1+1等於2,描述它這個值應該等於2,然後我們來檢驗一下是不是對的。然後assert的來源,看官方文檔,其實是使用的Node.js內嵌的assert模塊。其實有必要使用Node.js按照官方文檔去測試一番。

chai是什麼?chai只是一種風格,就像每個人都有自己的寫代碼風格。看它的官方網頁。它提供了幾種風格如,你覺得那種用起來爽就用哪種

[1,2,3].indexOf(4).should.equal(-1)
expect([1,2,3].indexOf(4)).to.equal(-1)
assert.equal([1,2,3].indexOf(4), -1)

assert.equal()哪來的?看node文檔assert.equal(actual, expected[,message])。第一個參數是實際actual,第二個參數是期望的expected,第三個參數是message,看下文檔裏有解釋,是可選的。

之後爲了方便,這package.json裏面設置一下

"scripts"{
	"test": "mocha"
}

後面可以很方便的使用

$ npm test
// 等於執行./node_modules/mocha/bin/mocha
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章