iT邦幫忙

1

鼠年全馬鐵人挑戰 WEEK 18:Jest (上)

                Photo on jestjs.io


前言

在前幾篇的文章內容中,介紹過兩個自動化測試框架的主題
分別是 Robot Framework 與 Nightwatch.js

而這個禮拜所要介紹的最後一個自動化測試框架
是與 Nightwath 一樣使用 JavaScript 程式語言撰寫測試腳本的 Jest

有興趣的大哥大姐,可以點下方連結參考參考~

鼠年全馬鐵人挑戰 WEEK 13:Robot Framework (上)
鼠年全馬鐵人挑戰 WEEK 14:Robot Framework (下)
鼠年全馬鐵人挑戰 WEEK 15:Nightwatch.js (上)
鼠年全馬鐵人挑戰 WEEK 16:Nightwatch.js (下)


介紹 Jest

Jest 適用於各種 JavaScript 框架
包括 BabelTypeScriptNodeReactAngularVue 等。

Jest 在使用上非常的快速簡單好上手,不用過多的設定操作即可使用。
透過指令還可以在測試執行完,清楚顯示測試的成功覆蓋率。


安裝 Jest

安裝 JavaScript 框架

小弟在這邊就一樣選擇 Node 來做 Jest 的 JavaScript 框架。

如果不確定是否已經安裝可以透過查詢版本來確認
$ node -v$ npm -v
如果尚未安裝 Node.js 和 npm 可點選下面連結安裝
官方載點 >>> nodejs.org

安裝 Jest

為了方便使用小弟就先建立一個 jest 的專案資料夾
$ mkdir jest && cd jest

接著透過 npm 來新增一個 package.json 的初始文件
$ npm init -y

確認 package.json 建立成功後
就可以下指令來安裝 jest 了
$ npm install --save-dev jest

此時在專案底下會增加 node_modules 和 package-lock.json 的資料夾與檔案


執行測試

為了確定 Jest 可以正常運作
小弟就先寫一個簡單的測試來試跑看看

首先,創建一個 sum.js 的 module 文件

module.exports = function (a, b) {
  return a + b;
}

然後,創建一個名為 sum.test.js 的測試文件。

const sum = require('./sum');

test('adds 1 + 2 to equal 3', () => {
  expect(sum(1, 2)).toBe(3);
});

接著,將執行指令添加到 package.json 文件中

{
  "scripts": {
    "test": "jest"
  }
}

最後,執行 $ npm run test
Jest將顯示以下消息

PASS  ./sum.test.js
✓ adds 1 + 2 to equal 3 (5ms)

結尾

這週的內容簡單的設定一下 Jest。
先做好簡單的初始作業,並執行簡單的測試。
如果有疑問或是有錯誤,還請各位大哥大姐提點。
小弟將繼續往下週邁進。 ─=≡Σ((( つ•̀ω•́)つ


參考文件:

Jest · ? Delightful JavaScript Testing


尚未有邦友留言

立即登入留言