[JS] Mocha ES6+ 測試設定

05 Apr 2017

現在新專案的開發，盡量都使用 ES6+ 的語法。Mocha 是跑在 Node.js 上，所以如果 Node.js 無法使用的新語法，則需要先透過 Babel 來轉檔，就像其他一般程式一樣。

Installation

要安裝 Babel 和 preset (當然這些應該是早該在開發時就安裝好了)：

npm install babel-core --save-dev

# For ES6/ES2015 support
npm install babel-preset-es2015 --save-dev

# If you want to use JSX
npm install babel-preset-react --save-dev

# If you *must* use experimental ES7 features
npm install babel-preset-stage-0 --save-dev

也要記得設定 .babelrc 檔(當然這些也應該是早該在開發時就安裝好了)：

{
  "presets": ["es2015", "react", "stage-0"],
}

Setting

其實最重要就是把原本 package.json 內：

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

改成以下，告訴 Mocha 要用 babel-core 來處理 .js 檔：

"scripts": {
    "test": "mocha --compilers js:babel-core/register"
  }

或如果是要測試 build 好的檔案的話：

"scripts": {
    "test": "npm run build && mocha --compilers js:babel-core/register"
  }

babel-polyfill

如果有錯誤的話，有可能的一個原因是，引入的東西並非使用 babel 就可以轉的單純語法，而額外需要 babel-polyfill：

npm install babel-polyfill --save

該測試檔案開頭記得加上：

import 'babel-polyfill';

Example

經過設定後，Mocha 就可以認得 ES6+ 的程式了，不管是測試程式或被測試的程式都可以透過 Babel 使用本來 Node.js 不能用的語法了：

// add.js
const add = (x, y) => x + y;

export default add;

// add.test.js
import add from '../src/add.js';
import chai from 'chai';

let expect = chai.expect;

describe('加法函數的測試', function() {
  it('1 加 1 應該等於 2', function() {
    expect(add(1, 1)).to.be.equal(2);
  });
});

pcwu's TIL Notes

[JS] Mocha ES6+ 測試設定

Installation

Setting

babel-polyfill

Example

Reference & Reading