[使用案例](https://openscreenshot.app/zh-tw/use-cases/)

# 如何為錯誤回報擷取截圖

擷取網頁出錯的部分，用箭頭和步驟編號標出問題，遮住權杖和電子郵件，再把圖片貼到 issue。

作者 [OpenScreenShot](https://github.com/pghqdev/OpenScreenShot)

錯誤回報時，只擷取網頁上顯示問題的部分，標出哪裡出錯，並在把圖片貼到 issue 之前遮住所有私人資訊。在 OpenScreenShot 中，用**選取區域**或**擷取元素**來擷取，用**箭頭**和**步驟編號**工具來標記，用**模糊**的**實色**填色來遮蔽。網址、瀏覽器和重現步驟請寫在 issue 內文，因為截圖只顯示網頁內容，不含網址列。

## 逐步擷取並標記錯誤

1. 開啟網頁，讓它進入出錯的狀態。關閉擋住問題的橫幅。
2. 在網頁上按右鍵，開啟 **OpenScreenShot** 子選單，選擇**選取區域**或**擷取元素**。在預設設定下，點一下工具列圖示則會擷取整個網頁。
3. 擷取區域時，在問題周圍拖曳出矩形，並保留足夠的周邊介面，讓人看得出位置。按 `Enter` 確認。擷取元素時，把游標移到想要的卡片、表格或表單上，直到出現外框，再點一下或按 `Enter`。
4. 在**編輯器**中，在出錯的細節處加上**箭頭**（`A`）。如果錯誤需要點好幾下才能重現，就為每個動作加上**步驟編號**（`S`）。
5. 選擇**模糊**（`B`），在**遮蔽**下選擇**實色**，蓋住存取權杖、電子郵件地址、帳戶名稱和內部主機名稱。
6. 點**複製**，或按 `Ctrl+C`（macOS 上是 `⌘C`），再把圖片貼到 issue。

在元素模式中，`↑` 會選取父元素，`↓` 會選取子元素。外框落在太小或太大的包裝元素上時，這很有用。如果元素沒有完整顯示在畫面上，選取器會改為提供整頁擷取。

## 擷取懸停狀態、下拉選單和提示框

選單或提示框常常在你點別處時就關閉。在彈出式視窗或**設定**中把**延遲**設為 3、5 或 10 秒，開始擷取，然後在工具列徽章倒數結束前打開選單。

延遲在區域選取開始之前執行，所以拖曳仍可能讓選單關閉。擷取懸停狀態時，請搭配延遲使用**可見範圍**，之後再用**裁切**（`C`）修剪。你也可以先選取一次區域，然後搭配延遲使用右鍵選單中的**重複上次區域**：它會擷取同一個矩形，不必再拖曳一次。

## 用剪貼簿動作略過編輯器

截圖不需要標記時，在彈出式視窗或**設定**中把**擷取後**設為**剪貼簿**。之後每次擷取都會直接送到剪貼簿，工具列徽章會確認。用 `Ctrl+V` 或 `⌘V` 把圖片貼到 issue。

這個設定也適用於鍵盤快速鍵和右鍵選單。需要註解或遮蔽時，再把它設回**編輯器**。擷取到剪貼簿會略過遮蔽步驟，所以擷取前請先檢查網頁上有沒有私人資料。

## 截圖旁邊要寫什麼

截圖顯示哪裡出了問題。issue 內文則提供開發人員重現問題所需的背景資訊：

- 網頁網址，並移除私人查詢參數
- 瀏覽器名稱和版本，以及作業系統
- 重現步驟，順序與圖片中的步驟編號相同
- 你預期的結果，以及實際發生的情況
- 問題發生的時間（如果網頁顯示即時資料）

一張截圖只放一個問題。同一張圖片裡如果還有第二個錯誤，就看不出箭頭指的是哪一個。

## 限制

模糊和馬賽克會柔化像素，但仍可能留下短文字的線索。**實色**會在匯出檔中完全蓋住該區域；[遮蔽指南](https://openscreenshot.app/zh-tw/blog/redact-screenshot/)說明如何檢查結果。瀏覽器內部頁面和其他受保護的網頁會封鎖擴充功能擷取；請參閱[支援與已知限制](https://openscreenshot.app/zh-tw/support/)。

[擷取模式參考](https://openscreenshot.app/zh-tw/docs/#modes)說明選取控制項，[註解參考](https://openscreenshot.app/zh-tw/docs/#annotate)列出所有工具和快速鍵。回覆回報問題的使用者時，請參閱[用於客戶支援的截圖](https://openscreenshot.app/zh-tw/use-cases/customer-support/)。要呈現錯誤的動態過程，請參閱[產品示範影片](https://openscreenshot.app/zh-tw/use-cases/product-demos/)。

## 繼續閱讀

[閱讀說明文件](https://openscreenshot.app/zh-tw/docs/)、[瀏覽所有指南](https://openscreenshot.app/zh-tw/blog/)，或[取得擷取方面的協助](https://openscreenshot.app/zh-tw/support/)。

---

Canonical page: https://openscreenshot.app/zh-tw/use-cases/bug-reports/
