讓 Codex 把手動驗收寫成瀏覽器測試
3 分鐘閱讀
新增任務、刷新、確認它還在——手動點一次不難。每次改程式碼都重複點，容易漏掉一步。可以把這些動作寫成瀏覽器測試，讓它反覆檢查同一個結果。
新增任務、刷新、確認它還在——手動點一次不難。每次改程式碼都重複點，容易漏掉一步。可以把這些動作寫成瀏覽器測試，讓它反覆檢查同一個結果。
這篇沿用待辦清單項目，用 Playwright 把「改好了」變成可檢查的行為。
從一條看得見的結果開始
下面按原演示的刷新測試整理，介面文字已改為香港繁體中文，並省略項目服務設定：
test('刷新後保留新增任務', async ({ page }) => {
await page.goto('/after/');
await page.getByLabel('新的待辦').fill('寫一條測試');
await page.getByRole('button', { name: '添加 +' }).click();
await expect(page.getByText('寫一條測試', { exact: true })).toBeVisible();
await page.reload();
await expect(page.getByText('寫一條測試', { exact: true })).toBeVisible();
await expect(page.getByRole('listitem')).toHaveCount(1);
});
測試需要項目已有的 test、expect 匯入和服務設定；頁面名稱也要與真實介面一致。這裏檢查的是任務文字和數量，不是某個函數有沒有被呼叫。
Playwright 的網頁斷言會等待條件滿足或超時。相比先固定睡幾秒，再猜頁面有沒有準備好，這種寫法更直接。Playwright 斷言說明
每項測試自己準備資料
刪除測試應自己新增要刪的任務，不能等上一項測試留下資料。獨立的瀏覽器上下文也能避免快取、登入和本地儲存串到下一項。Playwright 測試實踐
原項目首先覆蓋四件事：新增後刷新、刪除後刷新、空白輸入、壞 JSON 後仍能新增儲存。
還要看看測試能不能抓住問題
原實驗在主動關閉持續儲存的教學對照版執行刷新斷言，出現預期失敗；儲存版的4項測試全部通過。這樣至少知道這條斷言能發現「刷新就丟」的問題，沒有只檢查一條永遠成立的條件。
給 Codex 的任務可以這樣寫：
為待辦項目補上這四項瀏覽器驗收，每項獨立準備資料。
先證明刷新測試在教學對照版失敗，再檢查儲存版。
保留原有樣式和功能，不要為通過測試刪除斷言。
報告執行指令、結果以及沒有覆蓋的瀏覽器和場景。
原測試於2026年10月5日執行，環境為 Windows 本地 Edge、Playwright Test 1.63.0。本文10月27日整理，引用的是當時的4項驗收；後續項目另增了第5項結構異常測試。這裏沒有重新執行，也未驗證 Safari、Firefox、手機或跨裝置同步。
香港繁體版整理日期：2026年10月28日。原文引用的產品說明核對截至2026年10月27日；原實驗日期與範圍保留於文中。