首頁 > web前端 > js教程 > 單元和整合測試

單元和整合測試

Mary-Kate Olsen
發布: 2025-01-03 18:21:40
原創
197 人瀏覽過

?使用 Jest 和 Axios 進行 Fireup 單元和整合測試

測試是確保您的程式碼按預期工作並隨著時間的推移保持可靠性的重要組成部分。本指南透過使用 JestAxios 的範例解釋單元測試整合測試。到此結束時,您將能夠自信地編寫自己的測試! ?


?️ 目錄

  1. 測試簡介
  2. 單元測試
  3. 與 Ax​​ios 的整合測試
  4. 結論

?測試簡介

測試涉及驗證您的程式碼在各種條件下的行為是否符合預期。使用流行的測試庫 Jest,您可以編寫兩種關鍵類型的測試:

  • 單元測試:單獨測試各個功能或組件。
  • 整合測試:驗證應用程式的不同部分如何協同工作。

這些測試有助於及早發現錯誤、減少回歸問題並維持較高的程式碼品質。讓我們從探索單元測試開始! ?


?單元測試

單元測試專注於單獨測試單一功能或組件。它確保代碼的每個小單元按預期獨立工作。

範例:測試 Sum 函數

這是一個對兩個數字求和的簡單函數:

// src/sum.js
export const sum = (a, b) => a + b;
登入後複製
登入後複製

編寫單元測試

建立一個測試檔案 src/__tests__/sum.test.js 並寫入以下內容:

// src/__tests__/sum.test.js
import { sum } from '../sum';

describe('sum', () => {
  it('should add two numbers correctly', () => {
    expect(sum(1, 2)).toBe(3);
    expect(sum(-1, 1)).toBe(0);
  });
});
登入後複製
登入後複製

運行單元測試

使用以下命令執行測試:

npx jest src/__tests__/sum.test.js
登入後複製

如果一切按預期進行,您將看到一個 ✅ 確認測試已通過。

Unit & Integration Testing


?與 Axios 的整合測試

整合測試確保應用程式的不同部分能夠很好地協同工作。讓我們測試一個使用 Axios.

從 API 取得使用者資料的函數

範例:取得用戶數據

假設我們有一個從 API 檢索使用者資料的函數:

// src/apiService.js
import axios from 'axios';

export const fetchUserData = async (userId) => {
  const response = await axios.get(`https://jsonplaceholder.typicode.com/users/${userId}`);
  return response.data;
};
登入後複製

編寫整合測試

要測試此功能,請建立一個檔案 src/__tests__/apiService.test.js。我們將模擬 Axios 以阻止真正的 API 呼叫。

// src/sum.js
export const sum = (a, b) => a + b;
登入後複製
登入後複製

要點:

  • jest.mock('axios'):模擬整個 Axios 函式庫。
  • mockResolvedValue:模擬成功的 API 回應。
  • mockRejectedValue:模擬 API 失敗。

運行整合測試

使用以下命令執行測試:

// src/__tests__/sum.test.js
import { sum } from '../sum';

describe('sum', () => {
  it('should add two numbers correctly', () => {
    expect(sum(1, 2)).toBe(3);
    expect(sum(-1, 1)).toBe(0);
  });
});
登入後複製
登入後複製

如果成功,Jest 將確認成功和失敗場景的測試均已通過。 ✅

Unit & Integration Testing

?結論

單元和整合測試是建立可靠且可維護的應用程式的重要工具。使用 JestAxios,您可以:

  • 使用單元檢定驗證各個函數。
  • 使用整合測試驗證模組之間的交互作用。

單元和整合測試是確保您的程式碼單獨和集體運作良好的強大方法。立即開始在您的程式碼庫中新增測試,並享受知道您的應用程式經過充分測試所帶來的安心感。快樂的編碼和測試! ?‍?✨

以上是單元和整合測試的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:dev.to
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板