Feature #6704
Updated by Aiden cwc 3 days ago
### 測試目的 (Objective) 驗證使用者在咖啡杯圖示上按滑鼠右鍵時，系統能攔截瀏覽器預設 Context Menu，改為彈出自訂的加購對話框，並確保對話框中的確認加購（Yes）與取消（No）功能運作正常。 Menu，改為彈出自訂的加購對話框，並確保對話框中的確認加購與取消功能運作正常。 ### 前置條件 (Preconditions) 1. 開啟受測網站：[Coffee cart](https://coffee-cart.app/)。 2. 購物車初始為空（顯示 購物車初始為 `cart (0)` 與 `Total: $0.00`）。 (0)`。 ### 測試步驟 (Test Steps) 1. 將滑鼠移動到「Espresso Macchiato」的咖啡杯圖示區域。 將滑鼠移動到任一咖啡杯圖示（例如 Cafe Latte 的杯子繪圖區）。 2. 按下滑鼠右鍵（Right-click）。 3. 觀察瀏覽器是否攔截原生選單，並跳出自訂的「Add Espresso Macchiato 觀察瀏覽器是否跳出自訂對話框（Add to the cart?」確認對話框。 cart dialog），而非瀏覽器原生右鍵選單（檢查、另存新檔等）。 4. 點擊對話框內的「Yes」按鈕。 在自訂對話框中點擊「確認 / Add」按鈕。 5. 觀察頂部購物車計數器與右下角 Total 總額變化。 6. 再次於任一咖啡杯上按滑鼠右鍵喚出對話框，點擊「No」按鈕關閉對話框。 7. 在杯子圖示以外的空白區域按右鍵，檢視是否保留瀏覽器原生選單。 再次於另一咖啡杯上按滑鼠右鍵喚出對話框，點擊「取消 / Cancel」或對話框外區域。 ### 預期結果 (Expected Results) 1. 步驟 2-3：原生右鍵選單被 `preventDefault` 成功攔截，杯身正中央即時彈出白色矩形對話框，標題為 `Add {Coffee Name} 成功攔截，畫面中央或滑鼠旁彈出自訂的「Add to the cart?`，附帶 `[Yes]` 與 `[No]` 兩個選項。 cart」確認對話框。 2. 步驟 4-5：點擊 `Yes` 後對話框關閉，該品項成功加入購物車，右上角更新為 4：點擊確認後對話框關閉，Cafe Latte 成功加入購物車，右上角更新為 `cart (1)`，右下角金額同步累加。 (1)`，金額同步更新。 3. 步驟 6：點擊 `No` 後對話框順暢關閉，購物車品項數與總額維持不變。 5：點擊取消後對話框順暢關閉，購物車狀態不變，無多餘加購動作。 4. 步驟 7：在杯身圖示之外的網頁空白區域點擊右鍵，正常彈出瀏覽器原生的右鍵操作選單（如「檢查」、「另存新檔」等）。 在杯子圖示以外的空白區域按右鍵，應正常保留瀏覽器原生選單。