javascript單元測試框架mochajs詳解

關於單元測試的想法

對於一些比較重要的項目,每次更新代碼以後老是要本身測很久,擔憂一旦上線出了問題影響的服務太多,此時就但願能有一個比較規範的測試流程。在github上看到牛逼的javascript開源項目,也都是有測試代碼的,看來業界大牛們都比較注重單元測試這塊。
就我本身的理解而言:javascript

  • 涉及到大量業務邏輯的代碼,可能我沒有精力去給每一個函數都寫上單元測試的代碼,功能細節的測試應該交由測試的同事去完成,可是對會直接影響項目正常運行的重要的數據接口,仍是能夠看狀況寫上幾個單元測試用例的,每一次修改以後跑一跑用例測試一下。
  • 重要的框架底層模塊,任何地方出一個小問題,均可能影響到不少服務。對於這種模塊,最好是每一個函數、每種接口都寫上單元測試代碼,否則一出問題就是一個大坑啊。
  • 開放出去的公共模塊,能夠針對主要的函數和接口寫上單元測試代碼,這樣能夠確保模塊代碼比較健壯,看起來也專業一些:)。

基於以上幾個想法,我決定學習一款Javascript單元測試框架,並試試去使用它寫一些單元測試的代碼。
看了不少技術站點和博客的文章,參考了一部分開源項目的測試代碼,大體觀望下風向,決定學習一下mocha.js這款單元測試框架。
別人的文章都是別人本身學習、咀嚼理解出來的內容,想學的透徹一點,仍是本身學習並翻譯一遍原版官方的文檔比較好。css

mocha單元測試框架簡介

mocha是一款功能豐富的javascript單元測試框架,它既能夠運行在nodejs環境中,也能夠運行在瀏覽器環境中。
javascript是一門單線程語言,最顯著的特色就是有不少異步執行。同步代碼的測試比較簡單,直接判斷函數的返回值是否符合預期就好了,而異步的函數,就須要測試框架支持回調、promise或其餘的方式來判斷測試結果的正確性了。mocha能夠良好的支持javascript異步的單元測試。
mocha會串行地執行咱們編寫的測試用例,能夠在將未捕獲異常指向對應用例的同時,保證輸出靈活準確的測試結果報告。html

安裝mocha

npm install mocha -gjava

一個簡單的例子

全局安裝mocha後,在項目根目錄建立test目錄
編寫test01.jsnode

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

npm install chai --save 安裝一下官方文檔中使用的chai斷言模塊(一個用來判斷結果是否正確的模塊)
打開控制檯,在test目錄同級運行mocha,獲得以下結果:
Array
#indexOf()
√ should return -1 when the value is not present
1 passing (11ms)
能夠看到:
describe函數的第一個參數會被輸出在控制檯中,做爲一個用例集的描述,並且這個描述是能夠根據本身的需求來嵌套輸出的,下面稱之爲:用例集定義函數
it函數第一個參數用來輸出一個用例的描述,前邊打個對勾表明測試經過,第二個參數是一個函數,用來編寫用例內容,用斷言模塊來判斷結果的正確性,下面稱之爲用例函數jquery

mocha支持的斷言模塊

mocha支持任何能夠拋出一個錯誤的斷言模塊。例如:should.js、better-assert、expect.js、unexpected、chai等。這些斷言庫各有各的特色,你們能夠了解一下它們的特色,根據使用場景來選擇斷言庫。git

同步代碼測試

在測試同步代碼的時候,用例函數執行完畢後,mocha就直接開始執行下一個用例函數了。 下面是一個同步測試代碼的例子:github

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

異步代碼測試

官方文檔自稱,用mocha來測試異步的代碼不要再簡單!真的很自信啊~~
只須要在用例函數裏邊加一個done回調,異步代碼執行完畢後調用一下done,就能夠通知mocha,我執行完啦,去執行下一個用例函數吧!
就像下面這樣:web

describe('User', function() {
  describe('#save()', function() {
    it('should save without error', function(done) {
      var user = new User('Luna');
      user.save(function(err) {
        if (err) throw err;
        done();
      });
    });
  });
});

對於上面的狀況,判斷用例執行成功與否是在異步代碼的回調裏邊完成的,這種狀況適用於正確性判斷比較複雜的狀況。若是異步代碼中邏輯錯誤時,會在回調中拋出一個錯誤,那麼測試代碼還能夠再簡單一點:正則表達式

describe('User', function() {
  describe('#save()', function() {
    it('should save without error', function(done) {
      var user = new User('Luna');
      user.save(function(err) {
        if (err) throw err;
        done();
      });
    });
  });
});

promise代碼測試

若是異步模塊並非使用callback,而是使用promise來返回結果的時候,可讓用例函數返回一個promise對象來進行正確性判斷,像下面這樣:

beforeEach(function() {
  return db.clear()
    .then(function() {
      return db.save([tobi, loki, jane]);
    });
});

describe('#find()', function() {
  it('respond with matching records', function() {
    return db.find({ type: 'User' }).should.eventually.have.length(3);
  });
});

後邊還會再提到這種狀況

不建議使用箭頭函數

不建議在mocha測試框架中使用箭頭函數。箭頭函數語法中對this的綁定讓會用例函數沒辦法訪問Mocha框架上下文中定義的一些函數,例如this.timeout(1000)在箭頭函數中就沒法獲得正確的結果。
我對這裏的理解是:mocha會把用例函數註冊到自身的某個屬性中,經過屬性調用的使用,正常函數能夠訪問到mocha的其餘屬性,可是箭頭函數不行,就像下面的代碼同樣:

function getTest(){
    this.a=555;
    var test={
        a:1,
        b:function(){
            console.log(this.a)
        },
        c:()=>{
        console.log(this.a);
    }
}
    return test;
}
var test=getTest();
test.b();
test.c();

輸出結果是
1
555

鉤子函數

mocha提供4種鉤子函數:before()after()beforeEach()afterEach(),這些鉤子函數能夠用來在用例集/用例函數開始執行以前/結束執行以後,進行一些環境準備或者環境清理的工做。

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
});

鉤子函數的描述參數

定義鉤子函數的時候,能夠傳第一個可選參數做爲鉤子函數的描述,能夠幫助定位用例中的錯誤信息。若沒有穿第一個參數,使用一個非匿名函數做爲鉤子函數,那麼函數名稱就將被做爲鉤子函數的描述。

beforeEach(function() {
  // beforeEach hook
});

beforeEach(function namedFun() {
  // beforeEach:namedFun
});

beforeEach('some description', function() {
  // beforeEach:some description
});

異步的鉤子函數

鉤子函數不只能是同步函數,也多是異步的函數,就像前邊的異步測試用例函數同樣。若是咱們在開始以前,須要作一些異步的操做,例如在數據庫裏邊準備一些模擬數據,就須要用到這種場景了:

describe('Connection', function() {
  var db = new Connection,
    tobi = new User('tobi'),
    loki = new User('loki'),
    jane = new User('jane');

  beforeEach(function(done) {
    db.clear(function(err) {
      if (err) return done(err);
      db.save([tobi, loki, jane], done);
    });
  });

  describe('#find()', function() {
    it('respond with matching records', function(done) {
      db.find({type: 'User'}, function(err, res) {
        if (err) return done(err);
        res.should.have.length(3);
        done();
      });
    });
  });
});

全局鉤子

前邊講的鉤子函數都是定義在用例集函數裏邊的,若是在用例集函數以外定義鉤子函數,那麼這個鉤子函數將會對全部的mocha單元測試用例生效。若編寫了多個用例集js文件,不管在哪個用例集文件中,用例集函數以外定義鉤子函數,都會對全部用例函數生效。
前邊講到,用例集函數是能夠嵌套的,而mocha會生成一個包在最外面的describe函數,把全部的用例集包含起來,那麼在其中定義的鉤子函數也就對全部的用例函數生效了~

beforeEach(function() {
  console.log('before every test in every file');
});

延遲啓動測試

若是想在mocha命令運行以後,先作一些別的工做,再啓動測試,可使用mocha --delay命令,此命令會在全局環境中生成一個run函數,延遲工做完成後調用run函數便可啓動測試。

setTimeout(function() {
  // do some setup

  describe('my suite', function() {
    // ...
  });

  run();
}, 5000);

測試用例TODO

能夠編寫一個等待被實現的測試用例,在報告裏邊也會有提示

describe('Array', function() {
  describe('#indexOf()', function() {
    // pending test below
    it('should return -1 when the value is not present');
  });
});
2 passing (11ms)
  1 pending

僅執行一個用例集/用例

在用例集函數或者用例函數後邊添加.only()可讓mocha只執行此用例集或用例

describe('Array', function() {
  describe.only('#indexOf()', function() {
    // ...
  });
});

Array用例集下面的嵌套集合,只有#indexOf用例集會被執行

describe('Array', function() {
  describe('#indexOf()', function() {
    it.only('should return -1 unless present', function() {
      // ...
    });

    it('should return the index when present', function() {
      // ...
    });
  });
});

這種寫法,#indexOf用例集下面的用例,只有第一個加了only的會被執行。
注意:在同一用例集下有多個only標記,mocha會報錯。

跳過哪些用例集/用例

和加上.only相反,在用例集函數或者用例函數後邊加.skip(),能夠跳過此用例集或用例的執行。跳過的用例會被標記爲pending的用例,在報告中也會做爲pending用例體現出來。下面是一些例子:

describe('Array', function() {
  describe.skip('#indexOf()', function() {
    // ...
  });
});

跳過用例集

describe('Array', function() {
  describe('#indexOf()', function() {
    it.skip('should return -1 unless present', function() {
      // ...
    });

    it('should return the index when present', function() {
      // ...
    });
  });
});

跳過用例。
對於一些做廢的用例,按咱們以往的作法可能就是把它註釋掉,mocha推薦的作法是給它們加上skip標記。

除了使用添加skip標記以外,mocha還容許在用例執行的過程當中跳過此用例,例如用例執行須要某些上下文環境,可是執行的時候發現這些環境並無準備好,此時就能夠調用skip函數跳過此用例:

it('should only test in the correct environment', function() {
  if (/* check test environment */) {
    // make assertions
  } else {
    this.skip();
  }
});

上面被跳過的用例一樣會在測試報告中以pending的形式體現出來。爲了不測試邏輯混亂,在調用skip函數以後,就不要再再用例函數或after鉤子中執行更多的邏輯了。

這裏要說明一點,在一個用例函數中,不要存在一個邏輯分支啥也不作,直接讓整個用例函數結束,這樣是不科學的。用例函數中應該至少使用斷言作一個判斷,或者調用skip函數跳過用例。

it('should only test in the correct environment', function() {
  if (/* check test environment */) {
    // make assertions
  } else {
    // do nothing
  }
});

這樣的用例若是走到了do nothing邏輯,在報告中會被標記爲pass。比較推薦的作法是,在before鉤子函數中檢查測試須要的上下文環境,不具有則跳過。

before(function() {
  if (/* check test environment */) {
    // setup code
  } else {
    this.skip();
  }
});

從新執行用例

你能夠指定讓一個失敗的用例從新執行必定次數。這個特性是爲作end-to-end測試(功能性測試/Selenium測試)而設計的,這些測試數據很差模擬。 mocha是不推薦用這個特性來作單元測試的。

這個特性會從新運行用例函數的beforeEach和afterEach鉤子函數,可是不會從新運行before和after鉤子函數。

下面是一個從新執行的例子:

describe('retries', function() {
  // Retry all tests in this suite up to 4 times
  this.retries(4);
  
  beforeEach(function () {
    browser.get('http://www.yahoo.com');
  });
  
  it('should succeed on the 3rd try', function () {
    // Specify this test to only retry up to 2 times
    this.retries(2);
    expect($('.foo').isDisplayed()).to.eventually.be.true;
  });
});

動態生成用例

mocha可使用Function.prototype.call和函數表達式來定義用例集和用例,它們能夠用來直接動態生成一些測試用例,而不須要使用其餘額外的語法。
和你可能在其餘框架中見到的同樣,這個特性能夠實現經過定義一些參數來實現測試用例的功能。

var assert = require('chai').assert;

function add() {
  return Array.prototype.slice.call(arguments).reduce(function(prev, curr) {
    return prev + curr;
  }, 0);
}

describe('add()', function() {
  var tests = [
    {args: [1, 2],       expected: 3},
    {args: [1, 2, 3],    expected: 6},
    {args: [1, 2, 3, 4], expected: 10}
  ];

  tests.forEach(function(test) {
    it('correctly adds ' + test.args.length + ' args', function() {
      var res = add.apply(null, test.args);
      assert.equal(res, test.expected);
    });
  });
});

上面的測試會生成下面這樣報告:
add()
✓ correctly adds 2 args
✓ correctly adds 3 args
✓ correctly adds 4 args

測試時間

許多測試報告會展現測試時間,一樣也會標記出那些用例耗時比較長:

可能對於某些測試用例,耗時就是會比較長,那麼耗費多長時間才應該本認爲執行耗時過長呢? 能夠經過slow()函數來標記一下:

describe('something slow', function() {
  this.slow(10000);

  it('should take long enough for me to go make a sandwich', function() {
    // ...
  });
});

測試超時

用例集執行超時

在用例集下定義的timeout超時會對此用例集下定義的全部嵌套的用例集和用例生效,若是嵌套的用例集或者用例重寫了timeout時間,則會覆蓋上層的設置。經過this.timeout(0),能夠關掉用例或用例集的超時判斷。

describe('a suite of tests', function() {
  this.timeout(500);

  it('should take less than 500ms', function(done){
    setTimeout(done, 300);
  });

  it('should take less than 500ms as well', function(done){
    setTimeout(done, 250);
  });
})

用例執行超時

it('should take less than 500ms', function(done){
  this.timeout(500);
  setTimeout(done, 300);
});

鉤子函數超時

describe('a suite of tests', function() {
  beforeEach(function(done) {
    this.timeout(3000); // A very long environment setup.
    setTimeout(done, 2500);
  });
});

鉤子函數一樣能夠經過this.timeout(0)來關閉超時判斷。

diff差別比較功能

若斷言庫拋出了AssertionErrors,且錯誤對象中有err.expected屬性和err.actual屬性,mocha會嘗試在報告中展現指望的值和獲得的值的差別:

mocha使用命令和參數

mocha init 初始化瀏覽器中測試

mocha init命令用來生成一個瀏覽器中單元測試的架子。
新建一個目錄test

在同級目錄運行命令 mocha init test ,能夠看到test目錄下生成了一些樣式表文件和js腳本,以及一個用來運行用例、展現報告的index.html

接着使用文章開頭的chai斷言庫,此時須要用script標籤引入了,因而在index.html中加上

<script src="http://chaijs.com/chai.js"></script>

index.html內容以下:

<!DOCTYPE html>
<html>
  <head>
    <title>Mocha</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="mocha.css" />
  </head>
  <body>
    <div id="mocha"></div>
    <script src="http://chaijs.com/chai.js"></script>
    <script src="mocha.js"></script>
    <script>mocha.setup('bdd');</script>
    <script src="tests.js"></script>
    <script>
      mocha.run();
    </script>
  </body>
</html>

test.js是一個空文件,等待咱們去編寫用例,在其中加上:

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

在瀏覽器中打開index.html,能夠看到用例執行報告:

mocha命令參數

mocha命令的基本格式是:mocha [debug] [options] [files]
options包括下面這些,我翻譯了一部分目前能理解的

-h, --help                              輸出幫助信息    
     -V, --version                           輸出mucha版本    
     -A, --async-only                        強制讓全部測試用例必須使用callback或者返回promise的方式來異步判斷正確性    
     -c, --colors                            啓用報告中顏色    
     -C, --no-colors                         禁用報告中顏色    
     -G, --growl                             enable growl notification support    
     -O, --reporter-options <k=v,k2=v2,...>  reporter-specific options    
     -R, --reporter <name>                   specify the reporter to use    
     -S, --sort                              排序測試文件    
     -b, --bail                              bail after first test failure    
     -d, --debug                             enable node's debugger, synonym for node --debug
     -g, --grep <pattern>                    只執行知足 <pattern>格式的用例    
     -f, --fgrep <string>                    只執行含有 <string> 的用例    
     -gc, --expose-gc                        展現gc回收的log    
     -i, --invert                            讓 --grep 和 --fgrep 的匹配取反    
     -r, --require <name>                    require一下<name>指定的模塊    
     -s, --slow <ms>                         指定slow時間(單位ms,默認75ms)    
     -t, --timeout <ms>                      指定超時時間(單位ms,默認2000ms)    
     -u, --ui <name>                         指定user-interface (bdd|tdd|exports)    
     -w, --watch                             觀察用例文件變化,並從新執行    
     --check-leaks                           檢測未回收global變量泄露    
     --compilers <ext>:<module>,...          用指定的模塊來編譯文件    
     --debug-brk                             啓用node的debug模式    
     --delay                                 等待異步的用例集(見前邊的)    
     --es_staging                            enable all staged features    
     --full-trace                            display the full stack trace    
     --globals <names>                       allow the given comma-delimited global [names]    
     --harmony                               enable all harmony features (except typeof)    
     --harmony-collections                   enable harmony collections (sets, maps, and weak maps)    
     --harmony-generators                    enable harmony generators    
     --harmony-proxies                       enable harmony proxies    
     --harmony_arrow_functions               enable "harmony arrow functions" (iojs)    
     --harmony_classes                       enable "harmony classes" (iojs)    
     --harmony_proxies                       enable "harmony proxies" (iojs)    
     --harmony_shipping                      enable all shipped harmony features (iojs)    
     --inline-diffs                          顯示預期和實際結果的string差別比較    
     --interfaces                            display available interfaces    
     --no-deprecation                        silence deprecation warnings    
     --no-exit                               require a clean shutdown of the event loop: mocha will not call process.exit    
     --no-timeouts                           禁用timeout,可經過--debug隱式指定    
     --opts <path>                           定義option文件路徑    
     --prof                                  顯示統計信息    
     --recursive                             包含子目錄    
     --reporters                             展現可用報告    
     --retries                               設置失敗用例重試次數    
     --throw-deprecation                     每次調用deprecated函數的時候都拋出一個異常    
     --trace                                 顯示函數調用棧    
     --trace-deprecation                     啓用的時候顯示調用棧    
     --watch-extensions <ext>,...            --watch監控的擴展

下面是官方文檔對部分命令的詳細說明:

-W, --WATCH

用例一旦更新當即執行

--COMPILERS

例如--compilers coffee:coffee-script編譯CoffeeScript 1.6,或者--compilers coffee:coffee-script/register編譯CoffeeScript 1.7+

-B, --BAIL

若是隻對第一個拋出的異常感興趣,可使用此命令。

-D, --DEBUG

開啓nodejs的debug模式,能夠在debugger語句處暫停執行。

--GLOBALS

names是一個以逗號分隔的列表,若是你的模塊須要暴露出一些全局的變量,可使用此命令,例如mocha --globals app,YUI
這個命令還能夠接受通配符,例如--globals '*bar。參數傳入 * 的話,會忽略全部全局變量。

--CHECK-LEAKS

默認狀況下,mocha並不會去檢查應用暴露出來的全局變量,加上這個配置後就會去檢查,此時某全局變量若是沒有用上面的--GLOBALS去配置爲可接受,mocha就會報錯

-R, --REQUIRE

這個命令能夠用來引入一些依賴的模塊,好比should.js等,這個命令至關於在測試目錄下每一個js文件頭部運行一下require('should.js'),模塊中對Object、Array等對象的擴展會生效,也能夠用--require ./test/helper.js這樣的命令去引入指定的本地模塊。
可是... 很雞肋的是,若是要引用模塊導出的對象,仍是須要require,var should = require('should')這樣搞。

-U, --UI

--ui選項能夠用來指定所使用的測試接口,默認是「bdd」

-R, --REPORTER

這個命令能夠用來指定報告格式,默認是「spec」。可使用第三方的報告樣式,例如:
npm install mocha-lcov-reporter,--reporter mocha-lcov-reporter

-T, --TIMEOUT

用來指定用例超時時間

-S, --SLOW

用來指定慢用例斷定時間,默認是75ms

-G, --GREP

grep pattern能夠用來篩選要執行的用例或用例集,pattern參數在mocha內部會被編譯成一個正則表達式。
假若有下面的測試用例:

describe('api', function() {
  describe('GET /api/users', function() {
    it('respond with an array of users', function() {
      // ...
    });
  });
});

describe('app', function() {
  describe('GET /users', function() {
    it('respond with an array of users', function() {
      // ...
    });
  });
});

能夠用--grep api--grep app--grep users--grep GET,來篩選出要執行的用例。

測試接口類型

mocha的測試接口類型指的是集中測試用例組織模式的選擇,包括BDD行爲驅動開發(Behavior Driven Development),TDD測試驅動開發(Test-Driven Development),Exports,QUnit 和 Require-style 幾種。

BDD

BDD測試接口提供 describe(), context(), it(), specify(), before(), after(), beforeEach(), 和 afterEach()幾種函數,其中context函數只是describe函數的別名,specify函數也是if函數的別名。
mocha默認的測試接口,前邊的全部例子都是基於BDD來編寫的。

describe('Array', function() {
    before(function() {
      // ...
    });

    describe('#indexOf()', function() {
      context('when not present', function() {
        it('should not throw an error', function() {
          (function() {
            [1,2,3].indexOf(4);
          }).should.not.throw();
        });
        it('should return -1', function() {
          [1,2,3].indexOf(4).should.equal(-1);
        });
      });
      context('when present', function() {
        it('should return the index where the element first appears in the array', function() {
          [1,2,3].indexOf(3).should.equal(2);
        });
      });
    });
  });

TDD

TDD接口提供 suite(), test(), suiteSetup(), suiteTeardown(), setup(), 和 teardown()函數,用例寫法以下:

suite('Array', function() {
  setup(function() {
    // ...
  });

  suite('#indexOf()', function() {
    test('should return -1 when not present', function() {
      assert.equal(-1, [1,2,3].indexOf(4));
    });
  });
});

EXPORTS

Exports 的寫法有的相似於Mocha的前身expresso,其寫法以下:

module.exports = {
  before: function() {
    // ...
  },

  'Array': {
    '#indexOf()': {
      'should return -1 when not present': function() {
        [1,2,3].indexOf(4).should.equal(-1);
      }
    }
  }
};

經過exports導出的對象裏邊,除了幾個鉤子函數以外,其餘的Object類型屬性都是用例集,function類型的屬性都是用例。

QUNIT

像TDD接口同樣支持suite和test函數,同時又像BDD同樣支持before(), after(), beforeEach(), 和 afterEach(),等鉤子函數。

function ok(expr, msg) {
  if (!expr) throw new Error(msg);
}

suite('Array');

test('#length', function() {
  var arr = [1,2,3];
  ok(arr.length == 3);
});

test('#indexOf()', function() {
  var arr = [1,2,3];
  ok(arr.indexOf(1) == 0);
  ok(arr.indexOf(2) == 1);
  ok(arr.indexOf(3) == 2);
});

suite('String');

test('#length', function() {
  ok('foo'.length == 3);
});

REQUIRE

require測試接口容許你經過require來導入describe函數,取個任意的別名。若是你不但願測試中出現全局的變量,這個接口也是十分有用的。
值得注意的是,這裏的require不能直接經過node命令來執行,node的模塊管理是不能解析這裏的require的,須要經過mocha命令來運行。

ar testCase = require('mocha').describe;
var pre = require('mocha').before;
var assertions = require('mocha').it;
var assert = require('chai').assert;

testCase('Array', function() {
  pre(function() {
    // ...
  });

  testCase('#indexOf()', function() {
    assertions('should return -1 when not present', function() {
      assert.equal([1,2,3].indexOf(4), -1);
    });
  });
});

測試報告視圖

若是不本身加上自定義的報告輸出,mocha會在控制檯中輸出報告。

SPEC視圖

這個是默認的報告樣式,輸出一個嵌套的分級視圖

DOT MATRIX視圖

用一系列點點來表示用例,測試的是紅點,未實現的是藍點,比較慢的是黃點,經過的是白點,若是你想讓報告看起來簡潔一些,能夠用這個視圖。

NYAN視圖

尼瑪這是個毛線視圖啊,官方文檔都懶得給出說明

TAP視圖

LANDING STRIP視圖

‘Landing Strip’的意思是飛機降落跑道,這是一個逗逼測試人員弄出來的,像一架飛機降落同樣的視圖。

這個是墜機了的視圖......

LIST視圖

一個簡單的列表視圖

PROGRESS視圖

包含一個簡單的進度條的視圖

JSON視圖

輸出一個JSON做爲測試結果

JSON STREAM視圖

輸出的也是一個JSON,只不過輸出的時候會帶上換行

JSONCOV覆蓋率報告

一個依賴 node-jscoverage 模塊生成的視圖,用來生成覆蓋率報告

HTMLCOV覆蓋率報告

用來生成一個覆蓋率的html報告
https://github.com/expressjs/express/commit/b6ee5fafd0d6c79cf7df5560cb324ebee4fe3a7f

MIN視圖

只顯示整體測試狀況

DOC視圖

生成一個只包含html的body部分的報告,結構以下:

例如,測試代碼以下:

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

運行命令mocha --reporter doc array,結果:

<section class="suite">
  <h1>Array</h1>
  <dl>
    <section class="suite">
      <h1>#indexOf()</h1>
      <dl>
      <dt>should return -1 when the value is not present</dt>
      <dd><pre><code>[1,2,3].indexOf(5).should.equal(-1);
[1,2,3].indexOf(0).should.equal(-1);</code></pre></dd>
      </dl>
    </section>
  </dl>
</section>

本身添加head、html等標籤,再加上style,能夠生成自定義樣式的報告。

MARKDOWN視圖

生成一個markdown版本的報告,例子:https://github.com/senchalabs/connect/blob/90a725343c2945aaee637e799b1cd11e065b2bff/tests.md

HTML視圖

目前只有在瀏覽器中運行的mocha才能直接生成html報告,nodejs中能夠經過doc視圖或者markdown視圖獲得的內容本身用腳本生成html版本的~

第三方報告生成器

mocha容許咱們本身定義第三方的報告生成器,能夠參考文檔
一個例子:TeamCity reporter

在瀏覽器中運行mocha

mocha項目下都會有mocha.js和mocha.css供瀏覽器中的測試使用

只能在瀏覽器中使用的函數

mocha.allowUncaught() ,未捕獲的錯誤不會被拋出
下面是一個例子,在加載測試腳本以前,用mocha.setup('bdd')函數把測試模式設置爲BDD接口,測試腳本加載完以後用mocha.run()函數來運行測試

<html>
<head>
  <meta charset="utf-8">
  <title>Mocha Tests</title>
  <link href="https://cdn.rawgit.com/mochajs/mocha/2.2.5/mocha.css" rel="stylesheet" />
</head>
<body>
  <div id="mocha"></div>

  <script src="https://cdn.rawgit.com/jquery/jquery/2.1.4/dist/jquery.min.js"></script>
  <script src="https://cdn.rawgit.com/Automattic/expect.js/0.3.1/index.js"></script>
  <script src="https://cdn.rawgit.com/mochajs/mocha/2.2.5/mocha.js"></script>

  <script>mocha.setup('bdd')</script>
  <script src="test.array.js"></script>
  <script src="test.object.js"></script>
  <script src="test.xhr.js"></script>
  <script>
    mocha.checkLeaks();
    mocha.globals(['jQuery']);
    mocha.run();
  </script>
</body>
</html>

GREP

瀏覽器中能夠經過在url後邊加?grep=api參數,來使用grep命令

瀏覽器中的mocha配置

能夠經過mocha.setup()命令來設置配置

// Use "tdd" interface.  This is a shortcut to setting the interface;
// any other options must be passed via an object.
mocha.setup('tdd');

// This is equivalent to the above.
mocha.setup({
  ui: 'tdd'
});

// Use "tdd" interface, ignore leaks, and force all tests to be asynchronous
mocha.setup({
  ui: 'tdd',
  ignoreLeaks: true,
  asyncOnly: true
});

瀏覽器中特有的選項

noHighlighting

若是被設置爲true,mocha不會嘗試用高亮語法輸出測試代碼

MOCHA.OPTS(mocha配置)

在服務端運行的時候,mocha會去加載test目錄下的mocha.opts文件,來讀取mocha配置項。這個配置文件中的每一行表明一項配置。若是運行mocha命令的時候,帶上的配置參數與這個配置文件中的配置衝突的話,以命令中的爲準。例如:
--require should
--reporter dot
--ui bdd
上面的配置就會讓mocha 引入一下should模塊、報告樣式設置爲dot,而且使用bdd的測試接口。

test/ 目錄

默認狀況下,mocha會去當前路徑下的去找 ./test/*.js或者./test/*.coffee當作測試文件,因此測試文件應該放在test目錄下

編輯器插件

TEXTMATE、JETBRAINS (IntelliJ IDEA, WebStorm, etc.) 等編輯器均有支持mocha測試的插件,須要使用的話請自行查閱。

使用mocha的項目示例

這個是官方文檔地址:http://mochajs.org/

轉自個人我的站:http://zoucz.com/

相關文章
相關標籤/搜索