Kite的筆記
0%

單元測試JEST

發表於 更新於 分類於
712 1 分鐘

1. 測試的差異

  • Unit 測試成本最低、速度最快
  • UI測試成本最高、速度最慢
  • E2E test 看起來跟selumium 滿像的，它還有儲檔截圖的概念，屬於使用UI的方式進行測試

image-20210715153138009

puppeteer 這個套件 是以UI的方式進行測試，要寫DOM元素來模擬填寫資料

image-20210715171502770

1.1. 如何導入UNIT TEST

  • 情境描述
  • 測試的目標為何
  • 導入要測試的函式
  • 測試的期望是什麼

image-20210715160413550

1.2. 安裝JEST

npm init ，建立一個空的package 管理

image-20210715164624123

VSCode 套件，這個套件可以即時存檔的時候，在function 前面立即有綠勾或紅叉，告訴你這個測試結果是否通過。

image-20210715165151962

1.3. JEST 測試開發

1.3.1. 測試流程

  1. 定義一段函式並匯出
  2. 定義.test測試檔案，並匯入上方函式
  3. 驗證結果

筆記：使用node js 方式把 js export 出去

image-20210715164712315

筆記：再使用require 方式引入

image-20210715164747521

image-20210715161350226

1.3.2. JEST IO Docs

image-20210715161637847

1.3.3. 相關測試函式

image-20210715165433056

image-20210715165523555

1.3.3.1. 驗證物件內容是否正確

物件本是是參考位置的概念，所以如果要驗證物件的內容是否相同可以使用toEqual方法，這個屬於深複製方式進行每一個key、value驗證

image-20210715163557279

1.3.3.2. 陣列是否包含特定值

image-20210715163645518

image-20210715163706990

1.3.3.3. 數值必須大於300

image-20210715163752310

1.3.3.4. 正規表達式email 驗證

image-20210715163827033

1.3.3.5. describe 是一個群組的概念

image-20210715163849282

我們可以看到使用npm run test 有群組的訊息分類

image-20210715164302007

1.3.3.6. 非同步測試

image-20210715170005601

image-20210715170654309

image-20210715170552237

以下兩個測試都是一樣的結果，使用expct.assertions(1) ，這個是一個斷言的東西，告訴程式非同步的等待會有幾個

image-20210715171030792

使用await 代表要等到拿到資料之後，才會往下執行57行程式

image-20210715171103015