Jest 是當(dāng)下最主流的前端測(cè)試框架凿叠；對(duì)于初學(xué)者，Jest 配置入門并不算友好，尤其是選擇了 Typescript 做開發(fā)語言跺涤，教程很煩瑣匈睁。我最近試了一個(gè)叫 ts-jest 的預(yù)處理庫，配置非常簡單桶错，一共就三步航唆，這里推薦給大家。
安裝
我們從空白 node 項(xiàng)目開始——這里以 yarn 為例——安裝依賴：
yarn add -D jest typescript ts-jest @types/jest
主要就是四個(gè)庫： jest院刁、typescript自不必說糯钙，ts-jest是要用到的預(yù)處理器，@types/jest用于測(cè)試框架的類型推斷退腥。
生成配置
yarn ts-jest config:init
這里是利用 ts-jest 自動(dòng)生成 jest.config.js 文件任岸。生成的代碼如下所示：就三行，很簡單吧阅虫。
// jest.config.js
module.exports = {
preset: "ts-jest",
testEnvironment: "node",
};
運(yùn)行
yarn jest
完工演闭！附上了github repo，大家可以 clone 下來跑一下颓帝，也歡迎點(diǎn)贊米碰。
Jest Runner
我們?cè)囍鴮懸粋€(gè)簡單的單元測(cè)試用例（該測(cè)試本身無意義）：
function add(a: number, b: number): number {
return a + b;
}
describe("add function", () => {
it("1 + 1 = 2", () => {
expect(add(1, 1)).toEqual(2);
});
});
單元測(cè)試在日常操作中一般就是 git hook 里跑一個(gè)yarn test:unit，檢查當(dāng)前更改有沒有破壞之前的代碼邏輯购城。但是吕座，開發(fā)階段你更多只是跑一個(gè) case。這時(shí)候你又要寫新的命令yarn jest fileName -t caseName瘪板，很麻煩吴趴，而且很容易又碰到配置問題。這里推薦一款 vscode 插件——Jest Runner侮攀，看一下安裝后的效果：
每個(gè) Case 前都會(huì)出現(xiàn) Run|Debug 標(biāo)識(shí)锣枝，點(diǎn)擊后自動(dòng)運(yùn)行。我們?cè)倏纯?Debug 效果：
只要在 vscode 上打上斷點(diǎn)兰英，點(diǎn)擊 Debug 按鈕撇叁，就會(huì)自動(dòng)在斷點(diǎn)處停止，很方便吧畦贸。
小結(jié)
本文簡單介紹了 ts+jest 的入門配置陨闹，希望對(duì)初學(xué)者有所幫助。
最后再加幾句題外話：神書《人月神話》里提到過開發(fā)進(jìn)度的時(shí)間安排：
1/3 計(jì)劃薄坏、1/6 編碼趋厉、1/4 構(gòu)件測(cè)試以及 1/4 系統(tǒng)測(cè)試
測(cè)試時(shí)間占了一半，很意外吧胶坠？但是君账，我見過的絕大多數(shù)開發(fā)人員，90%以上的時(shí)間都在編碼涵但；設(shè)計(jì)文檔是不可能有的杈绸，測(cè)試用例也很稀少帖蔓。說來慚愧，我自己也是在工作四年后瞳脓，才開始改變那種工作方式的塑娇，然后我有了更多的時(shí)間寫博客了，哈哈劫侧。不過埋酬，很可惜，我依舊無法改變周圍人的開發(fā)方式烧栋，即便是強(qiáng)制他們寫測(cè)試写妥，也是應(yīng)付了事，唉审姓。
還有珍特，我從事過軟件外包工作，外包人員有個(gè)很具行業(yè)特色的現(xiàn)象——不寫測(cè)試魔吐。不知道大家看到后扎筒，有沒有覺得比我們外包強(qiáng)呢？
