原始碼測試
Vitest 提供了一種在原始碼中與實作程式碼並行執行測試的方法,類似於 Rust 的模組測試。
這種方式讓測試與實作程式碼共享相同的閉包,因此能夠針對私有狀態進行測試,而無需將其匯出。同時,它也為開發帶來更快速的反饋迴圈。
設定
首先,在原始檔的末尾加入一個 if (import.meta.vitest)
區塊,並在其中編寫測試。例如:
ts
// src/index.ts
// 實作程式碼
export function add(...args: number[]) {
return args.reduce((a, b) => a + b, 0);
}
// 原始碼內測試套件 (In-source test suites)
if (import.meta.vitest) {
const { it, expect } = import.meta.vitest;
it('add', () => {
expect(add()).toBe(0);
expect(add(1)).toBe(1);
expect(add(1, 2, 3)).toBe(6);
});
}
更新 Vitest 的 includeSource
配置,以包含 src/
目錄下的檔案:
ts
// vite.config.ts
import { defineConfig } from 'vitest/config';
export default defineConfig({
test: {
includeSource: ['src/**/*.{js,ts}'],
},
});
然後您就可以開始測試了!
bash
$ npx vitest
生產環境建置
為了在生產環境建置時移除測試程式碼,你需要在設定檔案中設定 define
選項,讓建置工具執行無用程式碼消除 (dead code elimination)。例如,在 Vite 中:
diff
// vite.config.ts
import { defineConfig } from 'vitest/config'
export default defineConfig({
+ define: {
+ 'import.meta.vitest': 'undefined',
+ },
test: {
includeSource: ['src/**/*.{js,ts}']
},
})
其他建置工具
unbuild
diff
// build.config.ts
import { defineBuildConfig } from 'unbuild'
export default defineBuildConfig({
+ replace: {
+ 'import.meta.vitest': 'undefined',
+ },
// other options
})
了解更多:unbuild
rollup
diff
// rollup.config.js
+ import replace from '@rollup/plugin-replace'
export default {
plugins: [
+ replace({
+ 'import.meta.vitest': 'undefined',
+ })
],
// other options
}
了解更多:rollup
TypeScript
要獲得對 import.meta.vitest
的 TypeScript 支援,請將 vitest/importMeta
加入你的 tsconfig.json
檔案中的 types
陣列:
diff
// tsconfig.json
{
"compilerOptions": {
"types": [
+ "vitest/importMeta"
]
}
}
參考 test/import-meta
以獲取完整範例。
備註
此功能可能適用於以下情況:
- 小範圍函數或工具的單元測試
- 原型設計
- 內聯斷言
對於更複雜的測試,例如元件或 E2E 測試,建議使用獨立的測試檔案。