首頁 >web前端 >js教程 >使用 Jest 掌握單元測驗:綜合指南

使用 Jest 掌握單元測驗:綜合指南

Mary-Kate Olsen
Mary-Kate Olsen原創
2024-12-30 14:54:15216瀏覽

Mastering Unit Testing with Jest: A Comprehensive Guide

簡介
單元測試是軟體開發的基石,可確保程式碼能如預期運作。在各種可用的測試框架中,Jest 已成為 JavaScript 開發人員的首選。 Jest 在建置時考慮到了簡單性和效率,讓開發人員以最少的配置建立強大的單元測試。

什麼是玩笑?
Jest 是由 Meta(以前的 Facebook)開發的開源 JavaScript 測試框架。它旨在與使用 React、Node.js 和其他 JavaScript 程式庫建立的應用程式無縫整合。 Jest 以其易用性、強大的功能和出色的開發體驗而聞名,使其成為編寫測試的首選工具。

為什麼要使用 Jest 單元測試?
Jest 簡化了編寫、組織和執行單元測試的過程。以下是開發者選擇 Jest 的幾個原因:

  • 零設定: Jest 開箱即用,只需最少的設定。
  • 內建模擬:它提供了模擬函數、模組甚至計時器的工具。
  • 快照測試: Jest 捕獲 UI 輸出以進行回歸測試。
  • 速度: Jest 並行運行測試以最大限度地提高效率。

在您的專案中設定 Jest

先決條件
在使用 Jest 之前,請確保您的電腦上安裝了 Node.js 和 npm。

安裝 Jest
要安裝 Jest,請執行以下命令:

狂歡

複製程式碼

npm install --save-dev 笑話

設定 Jest
可以透過在 package.json 檔案中新增 jest 屬性或建立專用的 jest.config.js 檔案來設定 Jest。這允許您自訂測試目錄、覆蓋閾值等選項。

用 Jest 寫你的第一個單元測驗

建立測試檔案
預設情況下,Jest 會辨識出副檔名為 .test.js 或 .spec.js 的測試檔。例如,如果您要測試 math.js 中的函數,請建立一個名為 math.test.js 的檔案。

寫測試案例
這是 Jest 測試案例的一個簡單範例:

javascript

複製程式碼

const add = (a, b) =>;一b; 

 

test('將兩個數字相加', () => { 

  Expect(add(2, 3)).toBe(5); 

}); 

運行測試
使用以下命令執行測試:

狂歡

複製程式碼

npm 檢定

Jest 將識別所有測試檔案並運行其中的測試案例。

Jest 用於單元測試的主要功能

模擬函數
Jest 可讓您模擬函數和模組來單獨測試元件:

javascript

複製程式碼

const mockFn = jest.fn(); 

mockFn.mockReturnValue(42); 

expect(mockFn()).toBe(42); 

快照測驗
快照測試可確保您的 UI 元件不會意外變更。 Jest 保存組件的輸出並在後續測試運行期間進行比較。

javascript

複製程式碼

test('正確渲染', () => { 

  const tree = renderer.create().toJSON(); 

 expect(tree).toMatchSnapshot(); 

}); 

代碼覆蓋率報告
Jest 提供了產生程式碼覆蓋率報告的內建支援:

狂歡

複製程式碼

npm 檢定 -- --覆蓋率

這會突出顯示程式碼中未經測試的部分。

編寫 Jest 單元測試的最佳實踐

保持測試獨立
避免測試之間的相互依賴,以確保可靠性和可維護性。

使用描述性檢定名稱
寫出清楚描述正在測試的場景的測試名稱,例如,「應該傳回兩個數字的總和」

關注邊緣案例
測試邊緣情況可確保您的應用程式在各種條件下都具有穩健性。

常見的笑話測試模式

排程-執行-斷言 (AAA)
將您的測驗分為三個不同的階段:

  1. 安排:設定測試資料和環境。
  2. Act: 執行正在測試的功能或特性。
  3. 斷言:驗證結果是否符合預期。

BeforeEach 和 AfterEach 鉤子
這些掛鉤可讓您在每次測試之前和之後設定或清理資源:

javascript

複製程式碼

beforeEach(() => { 

  初始化資料庫(); 

}); 

afterEach(() => { 

 clearDatabase(); 

}); 

調試 Jest 測試

在觀看模式下執行測試
只要偵測到更改,Jest 的監視模式就會重新執行測試:

狂歡

複製程式碼

npm 測驗 -- --watch

使用控制台日誌進行偵錯
新增 console.log() 語句可以幫助識別測試中的問題。

進階 Jest 功能

平行測試執行
Jest 並行執行測試以減少運行時間,這對於大型測試套件特別有利。

測試非同步程式碼
Jest 使用 async/await、Promises 和 done() 等實用程式處理非同步測試:

javascript

複製程式碼

test('取得資料', async () => { 

  const data = wait fetchData(); 

 expect(data).toBeDefined(); 

}); 

自訂匹配器
透過建立自訂匹配器來擴展 Jest 的功能,讓您的測試更具表現力。

Jest 與其他單元測試框架

易於使用
與 Mocha 或 Jasmine 不同,Jest 需要最少的設置,因此適合初學者。

內建功能
Jest 的內建功能(例如模擬和斷言)減少了對額外庫的需求。

社群支持
Jest 擁有龐大的社群和豐富的文檔,提供出色的支援和定期更新。

結論
Jest 是一個強大的工具,用於在 JavaScript 應用程式中編寫和運行單元測試。其簡單性、速度和豐富的功能集使其成為開發人員的最愛。透過遵循最佳實踐並利用 Jest 的功能,您可以確保您的程式碼可靠、可維護且無錯誤。

以上是使用 Jest 掌握單元測驗:綜合指南的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn