coffee-cart-cwc

Feature #6699

Updated by Aiden cwc 2 days ago

### 測試目的 (Objective) 
 驗證使用者點擊結帳按鈕後能正確呼叫付款表單 Modal，完成資訊填寫並提交後能接收交易成功反饋，且購物車完成結帳後應自動重置清空。 

 ### 前置條件 (Preconditions) 
 1. 開啟受測網站：[Coffee cart](https://coffee-cart.app/)。 
 2. 購物車內已有至少 1 件商品（如 Americano $7.00）。 

 ### 測試步驟 (Test Steps) 
 1. 點擊右下角 `Total: $7.00` 按鈕（或進入 `/cart` 頁面點擊`Total: $7.00`按鈕）。 按鈕。 
 2. 檢查是否彈出付款資訊輸入對話框（Payment Details Modal）。 
 3. 測試邊界檢查：不填寫必填欄位直接點擊確認付款按鈕，觀察表單驗證提示。 
 4. 輸入有效的測試資訊（如 Name: `Test User`，Email: `test@example.com`）。 
 5. 點擊提交付款（Submit）。 
 6. 觀察交易完成後的成功提示訊息。 
 7. 檢查結帳後全站的購物車狀態與總金額。 

 ### 預期結果 (Expected Results) 
 1. 步驟 2：付款彈窗正常彈出並鎖定背景滾動，清楚顯示應付總額（$7.00）。 
 2. 步驟 3：若未輸入必填資訊，欄位出現 HTML5 原生或自訂的警告提示，無法直接提交。 
 3. 步驟 5-6：提交後彈窗關閉並且頁面底下跳出成功訊息（Thanks for your purchase. Please check your email for payment.），系統無 JavaScript 異常。 
 4. 步驟 7：結帳完成後，購物車資料被完全重置： 
    - 頂部導覽列回復為 `cart (0)`。 
    - 右下角金額回復為 `Total: $0.00`。 
    - 進入 `/cart` 頁面顯示 `No coffee, go add some.`。

Back