# 測試與除錯 (/zh-Hant/docs/verdent-for-vscode/task-based-guides/testing-debugging)
> 使用 Verdent 進行測試與除錯的工作流程
Verdent for VS Code 透過多輪生成－測試－修復循環、錯誤分析以及自動化的測試覆蓋率改善，協助你撰寫完整的測試並除錯問題。生成符合你專案測試框架與風格的單元測試、整合測試與端對端測試。
### 你將學到 [#你將學到]
* 生成涵蓋邊界情況與預期行為的單元測試
* 使用所有主流測試框架（Jest、Pytest、JUnit 等）
* 建立驗證多元件工作流程的整合測試
* 透過找出並測試未覆蓋的程式碼路徑來改善測試覆蓋率
* 透過錯誤訊息分析與執行追蹤來除錯問題
* 從堆疊追蹤、錯誤日誌與非預期行為診斷錯誤
### 先決條件 [#先決條件]
在使用 Verdent 進行測試與除錯之前：
* 已安裝 Verdent 擴充功能的 Visual Studio Code
* 已在 VS Code 中開啟程式碼庫或專案工作區
* 有效的 Verdent 方案且有可用點數
* 專案中已設定測試框架（用於測試生成時為選用）
***
## 撰寫單元測試 [#撰寫單元測試]
Verdent 生成符合你專案測試框架與風格的單元測試。它會分析現有測試以理解你的模式，接著生成具有適當設定、斷言與模擬的測試。
**範例：**
```
Write unit tests for the calculateDiscount function
```
Verdent 會：
* 檢視 `calculateDiscount` 函式的實作
* 識別輸入參數與回傳值
* 分析現有測試以符合你的慣例（測試結構、斷言風格、命名模式）
* 生成涵蓋以下情況的測試：
* **正常路徑**：有效輸入與預期輸出
* **邊界情況**：邊界值、零、負數、最大值
* **無效輸入**：null、undefined、錯誤型別
* **預期行為**：商業邏輯驗證
**生成的測試結構：**
Verdent 依照你專案的模式建立測試：
* **測試套件組織**：describe 區塊、測試類別或模組結構
* **設定與清理**：符合你現有測試的 before/after hook
* **斷言**：使用你專案的斷言函式庫（expect、assert、should 等）
* **模擬**：符合你的模擬模式（jest.mock、sinon、unittest.mock）
* **命名慣例**：依照你既有風格的測試名稱
**多輪生成－測試－修復循環：**
為了進行完整的測試，Verdent 採用多輪循環：
1. **生成**：建立初始測試套件
2. **執行**：執行測試以驗證其運作
3. **修復**：修正失敗的測試或改善覆蓋率
4. **迭代**：重複進行直到測試通過且覆蓋率足夠
這能確保測試不僅被撰寫出來，而且確實能與你的程式碼庫正確協作。
Verdent 會分析你現有的測試以符合你的慣例。你現有的測試模式越一致，Verdent 生成的測試就越能與你專案的風格保持一致。
***
## 支援的測試框架 [#支援的測試框架]
Verdent 支援跨不同程式語言與技術堆疊的所有主流測試框架，無需額外設定。
**單元測試框架：**
```javascript Jest
test('sum returns correct result', () => {
expect(sum(2, 3)).toBe(5);
});
```
```javascript Mocha
const assert = require('assert');
describe('sum', () => {
it('returns correct result', () => {
assert.strictEqual(sum(2, 3), 5);
});
});
```
```javascript Vitest
import { describe, it, expect } from 'vitest';
it('sum returns correct result', () => {
expect(sum(2, 3)).toBe(5);
});
```
```javascript Jasmine
describe('sum', () => {
it('returns correct result', () => {
expect(sum(2, 3)).toEqual(5);
});
});
```
**框架專屬測試：**
* **React Testing Library** - 以使用者為中心的 React 元件測試
* **Vue Test Utils** - 官方 Vue.js 測試函式庫
**端對端測試：**
* **Cypress** - 端對端與元件測試
* **Playwright** - 跨瀏覽器端對端測試
* **Puppeteer** - 無頭 Chrome 測試
* **Pytest** - 最受歡迎的 Python 測試框架
* **unittest** - Python 內建測試框架
* **nose2** - 以外掛擴充 unittest
* **doctest** - 嵌入於 docstring 中的測試
Verdent 生成具有適當 fixture、參數化與斷言模式的測試，符合你的 Python 測試風格。
* **JUnit** - 標準 Java 測試框架（JUnit 4、JUnit 5）
* **TestNG** - 具備進階功能的測試框架
* **Mockito** - Java 的模擬框架
* **AssertJ** - 流暢的斷言函式庫
Verdent 建立具有註解、生命週期方法與斷言的測試，遵循 Java 測試慣例。
* **RSpec**（Ruby）- 行為驅動開發框架
* **PHPUnit**（PHP）- PHP 的單元測試框架
* **Go testing**（Go）- Go 內建測試套件
* **xUnit**（C#/.NET）- .NET 的測試框架
* **Catch2**（C++）- 現代 C++ 測試框架
Verdent 會適應你語言的測試慣用法，並生成符合你專案慣例的測試。
Verdent 從你的專案設定與現有測試中辨識你的測試框架，自動生成符合你設定的測試。
***
## 生成整合測試 [#生成整合測試]
Verdent 生成整合測試，驗證多個元件、服務或模組如何協同運作。它建立模擬真實工作流程的測試，包括 API 互動、資料庫操作、驗證流程與多步驟使用者旅程。
**範例：**
```
Write integration tests for the user registration flow
```
Verdent 生成驗證完整流程的測試：
1. **表單提交**：使用者以有效資料提交註冊表單
2. **驗證**：後端驗證電子郵件格式、密碼強度、資料完整性
3. **資料庫插入**：在資料庫中建立使用者記錄
4. **郵件傳送**：傳送確認電子郵件（模擬或實際）
5. **成功登入**：新使用者可立即以憑證登入
**整合測試結構：**
Verdent 建立的整合測試包含：
* **測試設定**：資料庫填充、服務初始化、測試資料建立
* **工作流程模擬**：依序執行多步驟操作
* **狀態驗證**：檢查資料庫狀態、API 回應、副作用
* **模擬外部服務**：郵件服務、付款 API、第三方整合
* **測試清理**：清理測試資料、資料庫回滾、服務關閉
**範例測試情境：**
```
Write integration tests for the checkout and payment process
```
Verdent 測試：
* 將商品加入購物車
* 套用折扣碼
* 計算含稅與運費的總額
* 處理付款（以模擬付款閘道）
* 在資料庫中建立訂單記錄
* 傳送確認電子郵件
* 更新庫存
**測試隔離：**
Verdent 確保整合測試適當隔離：
* 每個測試都以乾淨的資料庫狀態開始
* 模擬外部服務呼叫以防止副作用
* 測試可以任意順序執行而無相依性
* 即使測試失敗也會進行清理
整合測試受益於隔離的測試環境，Verdent 可協助設定資料庫 fixture 並模擬外部服務。
整合測試驗證元件能否正確協同運作。它們比單元測試更複雜，但能提供更高的信心，確保真實世界的工作流程如預期運作。
***
## 改善測試覆蓋率 [#改善測試覆蓋率]
Verdent 分析你的程式碼庫，找出未測試的函式、分支與邊界情況，接著生成測試以改善覆蓋率。它檢視你現有的測試套件，找出程式碼路徑未被執行的缺口。
**範例：**
```
Analyze test coverage and write tests for uncovered code paths in the payment module
```
Verdent 會：
1. **分析現有測試**：檢視目前測試了哪些內容
2. **找出覆蓋率缺口**：找出缺少測試的特定函式、條件分支、錯誤處理路徑與邊界情況
3. **生成缺少的測試**：建立針對未覆蓋程式碼的測試
4. **驗證覆蓋率改善**：執行測試以確認覆蓋率提升
**Verdent 找出的內容：**
* **未測試的函式**：完全沒有測試覆蓋的函式
* **條件分支**：if/else 陳述式中某一分支未被測試
* **錯誤處理路徑**：沒有失敗測試的 try/catch 區塊或錯誤回呼
* **邊界情況**：邊界值、null/undefined 處理、型別強制轉換
* **整合點**：API 呼叫、資料庫操作、外部服務互動
**範例覆蓋率改善：**
```
Improve test coverage for the UserService class
```
Verdent 找出：
* `getUserById` 有針對有效 ID 的測試，但沒有針對無效 ID 的測試
* `updateUser` 缺少驗證失敗的測試
* `deleteUser` 缺少授權檢查的測試
* `createUser` 中的錯誤處理路徑未被測試
接著生成專門針對這些缺口的測試，將覆蓋率從 65% 提升至 95%。
**覆蓋率指標：**
Verdent 協助你達到更高的覆蓋率百分比，並在先前未測試的程式碼中捕捉潛在錯誤：
* **行覆蓋率**：測試所執行的程式碼行數百分比
* **分支覆蓋率**：被測試的條件分支百分比
* **函式覆蓋率**：至少有一個測試的函式百分比
* **陳述式覆蓋率**：被執行的陳述式百分比
***
## 使用 Verdent 除錯 [#使用-verdent-除錯]
Verdent 透過分析錯誤訊息、追蹤執行流程、找出根本原因並建議修正來協助除錯。貼上錯誤日誌、描述非預期行為，或要求 Verdent 調查特定問題。
描述哪裡出錯以及你的預期：
```
This function returns undefined instead of the user object. Debug it.
```
Verdent 會：
* 讀取函式實作
* 追蹤執行流程
* 找出程式碼路徑出錯之處（遺漏 return 陳述式、錯誤的條件、async/await 問題）
* 提出修正並附上說明
* 建議測試案例以防止退化
**範例：**
```
The login form redirects to the home page even when credentials are invalid
```
Verdent 會：
* 檢視登入表單提交邏輯
* 追蹤驗證流程
* 找出錯誤（重新導向在非同步驗證完成之前發生）
* 提出修正（在重新導向之前 await 驗證）
要求效能分析：
```
The product search is slow when the database has 10,000+ products
```
Verdent 會：
* 分析搜尋查詢實作
* 找出低效之處（N+1 查詢、缺少資料庫索引、低效演算法）
* 建議最佳化（新增資料庫索引、批次查詢、快取結果）
效能除錯有助於找出演算法、資料庫查詢或 API 回應中拖慢應用程式的瓶頸。
了解程式碼如何執行：
```
Why does this API endpoint return a 500 error when the email parameter is missing?
```
Verdent 會：
* 追蹤從端點到驗證再到資料庫的請求處理
* 找出錯誤發生之處（存取 undefined 的屬性）
* 解釋錯誤發生的原因（在屬性存取前缺少 null 檢查）
* 建議防禦性修正（在使用參數之前先驗證）
執行流程追蹤有助於你了解程式碼所走的路徑，以及它在何處偏離預期行為。
將錯誤訊息或堆疊追蹤直接貼入聊天中。Verdent 會分析錯誤、定位有問題的程式碼，並以具體的檔案路徑與行號解釋哪裡出錯。
***
## 從錯誤訊息與日誌診斷 [#從錯誤訊息與日誌診斷]
將錯誤訊息、堆疊追蹤或日誌檔案直接貼入聊天中。Verdent 會分析錯誤、找出來源檔案與行號、解釋原因並建議修正。
貼上錯誤訊息與堆疊追蹤：
```
TypeError: Cannot read property 'name' of undefined
at UserProfile.render (UserProfile.jsx:45)
at processComponent (react-dom.js:2103)
```
將此貼入 Verdent：
```
I'm getting this error: [paste stack trace]
```
Verdent 會：
* 識別錯誤類型（來自 null/undefined 存取的 TypeError）
* 定位確切的行（`UserProfile.jsx:45`）
* 讀取該位置的程式碼
* 解釋發生原因（資料載入前 user 物件為 undefined）
* 提出修正：
* 新增 null 檢查：`if (!user) return `
* 使用可選串連：`user?.name`
* 確保資料在渲染元件之前載入
貼上日誌檔案或主控台輸出以進行分析：
```
Analyze these logs and tell me why the API requests are failing:
[paste 50 lines of log output]
```
Verdent 會：
* 掃描日誌以找出錯誤模式
* 識別驗證失敗、網路逾時或資料庫錯誤
* 追蹤導致失敗的事件序列
* 根據錯誤模式建議修正
日誌分析有助於找出多次失敗之間的模式，並了解導致錯誤的事件序列。
對於複雜問題，Verdent 採用多步驟除錯：
1. **分析錯誤日誌**以找出失敗點
2. **讀取相關程式碼**以了解實作
3. **追蹤執行流程**以找出出錯之處
4. **建議修正**並附上程式碼範例
5. **生成測試**以防止退化
**範例：**
```
The shopping cart total is sometimes incorrect. Here are the error logs: [paste logs]
```
Verdent 會：
1. 分析日誌並找出錯誤發生的時機（套用折扣碼時）
2. 讀取折扣計算邏輯
3. 找出錯誤（折扣在稅前計算，而非稅後）
4. 提出修正（重新排序計算步驟）
5. 建議測試案例（含折扣的購物車、含稅的購物車、兩者皆有的購物車）
***
## 最佳實務 [#最佳實務]
在開發功能時撰寫測試，而非在完成後。Verdent 可在建立新函式或元件後立即生成測試。
Verdent 會符合你專案的測試模式。維持一致的測試結構，讓 Verdent 生成的測試能與你的慣例保持一致。
要求 Verdent 測試邊界條件、錯誤情境與不尋常的輸入：「撰寫測試，包含無效輸入與邊界值的邊界情況。」
不要轉述錯誤。貼上完整的堆疊追蹤以獲得準確診斷與更快解決。
除錯時，清楚說明你預期發生什麼以及實際發生什麼。這個上下文有助於 Verdent 找出根本原因。
對於關鍵功能，要求進行多輪循環的完整測試生成：「為付款模組生成完整測試並驗證它們全部通過。」
重構程式碼後，要求測試以驗證功能得以保留：「生成測試以驗證重構後的驗證模組正確運作。」
修正錯誤後，要求一個測試以防止退化：「撰寫一個測試以確保此錯誤不再發生。」
***
## 另請參閱 [#另請參閱]
了解如何透過 Verdent 的 AI 協助撰寫新功能
透過安全的重構工作流程改善程式碼品質