🥜 前情提要

在上一回中，我們介紹了前端在CI/CD中很常使用的工具 WebPack，今天介紹另一個工具單元測試。

單元測試（Unit Test）：

就是以程式中最小的邏輯單元寫測試程式，來驗證邏輯是否正確。一般來說，程式中最小的邏輯單元是函式(function)，或方法(method)。

為什麼要做 Unit Test？

今天流程是：拿杯子 -> 裝熱水 -> 拿熱水壺 -> 倒入水杯，如果因為修改了拿杯子這個函數，導致後面三個函數都執行失敗，於是你從倒入水杯往回追，浪費一堆時間。所以為了避免Bug的連動性，盡早知道是拿杯子這個單元錯誤。
更快速指出問題點、並顯示正確的是什麼，減少Code Review時間。
先搞懂自己的code要做什麼。然後再讓它完成任務。
先寫測試強迫你寫code前先做規劃

Mocha：

以上就是單元測試的說明，那麼我來回顧，首先我們知道怎麼運用WebPack將我們的程式打包再一起，但是沒有進行單元測試，所以只能靠出版後才知道有問題，知道問題後CodeReview一段時間才知道，哪個函數錯誤、應該要出現的結果等等，明顯浪費了一些時間。

Mocha就是一款基於NodeJS開發的工具，主要功能就是實現單元測試，你可以輸入

1 2	npm init -y npm i -d mocha

進行下載並安裝，然後於package.json的任務加入以下實作內容：

{
  "name": "Demo",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "start": "mocha 'test/**/test-*.js'"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "mocha": "^7.0.0"
  }
}

這邊完成後我們來布置環境，首先找出你的源碼：

MathObj.js丟入根目錄的src資料夾內：

function add(a, b) {
    return a + b;
}

exports.add = add;

然後我們開始撰寫測試碼：

test-MathObj.js丟入根目錄的test資料夾內：

const MathObj = require('./../src/MathObj');

describe('測試add函數', () => {
    it('測試5+5預期10', () => { 
        if (MathObj.add(5, 5) !== 10) {
            throw new Error("兩數相加結果不為兩數和"); 
        }
    })
    it("測試-2+2預期0", () => {
        var t = -2;
        var g = 2;
        if (MathObj.add(t, g) !== t + g) {
            throw new Error("Not eq zero")
        }
    })
});