mocha

這篇文章百分之99都是照着 mocha官網的內容來寫的。就是個掃盲文，若是你想得到關於mocha更深層次鮮爲人知的內容，仍是別浪費你寶貴的十幾分鍾了，立刻叉掉。不爲啥的，我就作個筆記，方便之後複習。

mocha(抹茶)是一款javascript測試框架，支持在node和瀏覽器端運行。它比QUnit更完善，可擴展性更強。在官網上，對它的描述就是簡單，可擴展，有趣。（有趣是什麼鬼）

使用

// 1
npm install mocha -g 
mocha ./test.js

// 2
npm install mocha --save-dev 
node .node_modules/mocha/bin/mocha ./test.js

主要api

mocha只有兩個主要的api。

• describe(name, fn) 定義一組測試
• it(name, fn) 定義一項測試

describe('proxy', function(){
  it('proxy data 1', function(done){
    this.timeout(1000)
    assert.ok(true, 'fail')
  })

你也能夠在一組測試裏面再定義一組測試

describe('group1', function(){
  describe('child1', function(){
   })
})

只測試其中某一組測試

describe('test', function(){
  describe.only('testc1', function(){
  })
 })

跳過某一組測試

describe('test', function(){
  describe.skip('testc1', function(){
  })
 })

斷言

mocha沒有佩戴本身的斷言庫，它容許你使用第三方斷言庫，如node 內置的assert, chai等。只要程序拋出一個錯誤，mocha就會認爲測試不經過。

const assert = require('assert') // 使用node內置的斷言庫

describe('proxy', function(){
  it('proxy data 1', function(done){
    this.timeout(1000)
    assert.ok(true, 'fail')
  })

node assert 斷言

• assert.fail(String | Error)
  拋出一個AssertionError, 若是參數是一個Error,則會拋出這個Error。
• assert.ifError(any)
  只要any 不等於undefined | null 就拋出any
• assert.ok(value[,maessage])
  測試value 是否爲真值
• assert.equal(actual, expected [,message]) | assert.notEqual(actual, expected [,message])
  對actual 和 expected 執行 == 比較
• assert.strictEqual(actual, expected [,message]) | assert.notStrictEqual(actual, expected [,message])
  對actual 和 expected 執行 === 比較
• assert.deepStrictEqual(actual, expected[,message]) | assert.notDeepStrictEqual()
  測試是否深度全等, 執行的是=== 比較

異步測試

• 回調形式

describe('Array', function(){
  it('should correct', function(done){
    setTimeout(done,1000)
  })
})

若是done()執行的時候有參數，如done('錯誤')， 那麼mocha斷定測試不經過。 你也能夠直接傳入一個Error對象到done函數中，如done(new Error('fail'))

• promise的形式

describe('Array', function(){
  it('should correct', function(){
    return Promise.resolve()
  })
})

若是it 函數的返回值是一個promise, 將被是爲是一個異步測試。而且根據promise的fullfill狀態來決定測試是否經過。
值得注意的是，當你以爲使用promise的形式時候，你就不該該再it的回調函數聲明參數done。這個會讓mocha認爲你實際上是想經過done的形式來完成異步測試的。

describe('Array', function(done){ // 這個done是不須要的。
  it('should correct', function(){
    return Promise.resolve()
  })
})

• 使用async-await

describe('Array', async function(done){ // 這個done是不須要的。
  it('should correct', function(){
    let result = someAsyncOperation()
    assert.ok(true, result)
  })
  
})

箭頭函數

mocha不提倡使用箭頭函數，由於it， describe都是綁定mocha context執行的，在箭頭函數中，沒法獲取到mocha context。如如下會報錯

describe('Array', () => {
  it('shoule correct', (done) => {
     this.timeout(1000) // can not read property timeout of undefind
  })
})

hook

mocha 在整個測試周期中，提供了一組hook鉤子來讓開發者在測試開始以前準備環境或者是測試完成以後清理環境。

describe('hooks', function() {

  before(function() {
    // runs before all tests in this block
  });

  after(function() {
    // runs after all tests in this block
  });

  beforeEach(function() {
    // runs before each test in this block
  });

  afterEach(function() {
    // runs after each test in this block
  });

  // test cases
});

異步鉤子
在鉤子函數中傳入done，而且在異步鉤子完成時調用它。

describe('hooks', function() {

  before(function(done) {
    // runs before all tests in this block
    setTimeout(() => {
      done() // 2000ms以後纔會執行下一個鉤子
    }, 2000)
  })
});

mocha默認的測試超時時間是2000ms，若是你的異步鉤子準備時間超過2000ms，請事先聲明超時時間

在瀏覽器端測試

之後補上

vscode 插件

vscode 上面有一個輔助mocha測試的插件 mocha sidebar。

• New code coverage support
• see all tests in vscode side bar menu
• git lens for running/debugging directly form the code
• decorations which shows test status(pass/fail/not run) from code
• run tests for each level hierarchy from all tests to a single test(and each describer of course)
• debug tests for each level hierarchy from all tests to a single test(and each describer of course)
• auto run tests on file save
• see tests results directly on the code
• run/debug results directly from the code
• see test errors as decoration
• NEW add context menu on folders in explorer to set subdirectory (#2).

設置使用babel-register
在vscode的首選項設置以下：

"mocha.requires": ["babel-register"]

mocha sidebar 0.20.22 版本目前只支持babel 6, 若是你使用babel 7 ，那麼你就只能在命令中運行測試

mocha --require @babel/register xxx.js

ES6 的module 語法

ES6的import 和 export 在node中並無實現，因此咱們須要經過Babel轉換ES6的模塊語法。

npm install babel@6 babel-preset-env babel-register

//.babelrc
{
  "presets": ["env"]
}

如今你能夠在啓動時加入--require參數來讓使用了ES6 import/export語法的測試文件在加載時使用babel編譯。

mocha --require babel-register ./test/test.js

import _ from 'lodash'
describe('Array', function(){
  it('should correct', function(){
    return Promise.resolve()
  })
})

若是你不使用--require參數，那麼你須要顯式使用babel-register

// index.js
require('babel-register')
require('./test.js')

// test.js
import _ from 'lodash'
describe('Array', function(){
  it('should correct', function(){
    return Promise.resolve()
  })
})

// comman line
mocha ./index.js

babel-register 會在node 的require中注入一個鉤子，讓全部以.es6, .jsx, .js, .es做爲後綴結尾的文件在require的時候都先通過babel編譯。這樣子咱們在index.js require('./test.js')的時候，就已經將import 語法轉換爲requrie語法了。