在武學中，內力不穩會導致招式時而成功、時而失敗，這就是「走火入魔」的徵兆。在自動化測試的世界裡，這種不穩定的測試被稱為 Flaky Test（不穩定測試），它是所有測試工程師的夢魘。Flaky Test 就像是一顆不定時炸彈，會在沒有修改程式碼的情況下失敗，如果花費太多時間在這些 False Alert 的測試案例，可能會動搖整個團隊對於自動化測試的信心。

內功心法：什麼是 Flaky Test？

Flaky Test指的是那種在相同的程式碼和相同的環境下，有時候會成功，但有時則失敗的測試案例。它並不是因為程式碼改動而導致失敗，而是有其他不可預期的原因，例如：測試案例可能依賴系統時間，或是依賴於非同步操作（例如：API 請求、動畫效果）完成後，需要等待網路回應完成後，才能判斷測試步驟，如果沒有良好的等待機制，就可能造成測試案例失敗。另外，測試依賴外部服務，但外部服務不穩定或網路延遲，也會造成測試案例失敗。最常見到的可能是多個測試案例同時存取或修改相同的資源（例如：資料庫裡的資料、快取），也會造成測試案例執行時，有相依關係。如果使用的 CSS 或 XPath 選擇器(Selector)不穩定，也很容易因為 UI 變動而讓測試案例失敗。

招式演練：Flaky Test 的診斷三步驟

要修復 Flaky Test，首先必須能夠診斷它。Playwright 提供了強大的工具，讓這個過程變得簡單。

第一步：啟用重試機制（Retries）

Playwright 內建了重試功能，可以在 playwright.config.ts 設定檔中開啟。這能讓你確認一個失敗是否為 Flaky Test，而不是真正的 Bug。

// playwright.config.ts
import { defineConfig } from '@playwright/test';

export default defineConfig({
  // 測試失敗時，會自動重試 3 次
  retries: 3,
});

當一個測試在重試後成功，你就可以確定它是一個 Flaky Test。這時，你就可以開始進行第二步。

第二步：生成執行追蹤報告（Trace Viewer）

Playwright 的 Trace Viewe 是診斷 Flaky Test 的最強大工具。它會記錄測試的每一步驟，包括 DOM 快照、網路請求、操作日誌等，讓你可以像看電影一樣回放測試的整個過程。

# 啟用追蹤報告
npx playwright test --trace on

當測試失敗後，你可以在結果報告中看到一個連結，點擊後會開啟 Trace Viewer，幫助你分析失敗的根本原因。

第三步：重複執行測試案例

Playwright 的 --repeat-each可以讓測試案例重複執行來確認測試案例的穩定性。

# 測試案例重複執行 100 次
npx playwright test --repeat-each=100

實戰心法：讓 Flaky Test 變穩定的八大技巧

當你找出問題根本原因後，我提供幾個以下能夠讓測試案例變得穩定的幾個技巧：

1. 使用穩定的選擇器(Selector)：Playwright 建議優先使用 getByRole, data-testid 或 id，避免使用不穩定的 class 或 XPath。
2. 增加等待機制：Playwright 的 expect().toBeVisible() 或 expect().toBeEnabled() 等斷言(Assert)會自動等待，遠本比手動 sleep 更好。
3. 使用 page.waitForSelector()或是使用 Loadable Component 模式：在進行下一步前，確保元素已經存在於頁面上。
4. 處理非同步操作：確保測試在進行斷言前，所有非同步操作都已完成。
5. 避免依賴外部 API：善用 Mock Server（如第 25 天所學），將外部依賴隔離開來。
6. 測試案例獨立性：確保每個測試案例的執行，都不會影響到其他測試案例。
7. 統一測試環境：盡可能使用相同的測試環境（作業系統、瀏覽器版本），避免因環境差異導致的問題。
8. 優化測試資料：確保測試資料是乾淨、獨立的。在每次測試開始前，可以清除舊資料或建立新資料。

秘笈傳授：自動化偵測 Flaky Test

除了手動診斷，你也可以在 CI/CD 流程中加入自動偵測 Flaky Test 的機制。

1. 透過 CI/CD 重試：在 CI/CD 流程中，將 playwright test 指令加上 --retries 參數，讓它自動處理不穩定的測試。
2. 根據測試報告分析：搭配 Playwright 的 HTML Reporter 或其他 CI/CD 工具的報告，定期分析那些需要多次重試才成功的測試，將它們標記為 Flaky Test，並排入修復清單。

收功：今日總結

今天，我們學習了如何診斷與修復 Flaky Test，這讓我們的測試套件從「不穩定」走向「穩定」，當我們能夠精準的抓到產品的問題，團隊也會對於自動測試有信心。我們學會了利用 Playwright 的 retries 和 trace功能來診斷問題，更重要的是，在我們一開始撰寫測試程式碼的時候，盡量遵守測試穩定的八大技巧，這不僅是修復 Flaky Test 的方法，也是你未來撰寫測試時必須遵循的內功心法。