Cypress - 報告

---

Cypress 內建了 Mocha。因此，任何可以為 Mocha 生成的報告也可以用於 Cypress。除此之外，Cypress 還支援其他第三方報告工具，例如 JUnit 和 TeamCity。

Mochawesome 報告

Mochawesome 報告是 Cypress 中最重要的報告之一。

• 要安裝 mochawesome，請執行以下命令：

npm install mochawesome --save-dev

您的電腦上將出現以下螢幕：

• 要安裝 mocha，請執行以下命令：

npm install mocha --save-dev

您的電腦上將出現以下螢幕：

• 要合併 mochawesome json 報告，請執行以下命令：

npm install mochawesome-merge --save-dev

您的電腦上將出現以下螢幕：

安裝所有這些包後，應該會在 package.json 檔案中反映出來。

要將多個報告合併到單個報告中，請執行以下命令：

npm run combine-reports

cypress.json 檔案中的配置

在 cypress.json 檔案中，我們可以為 mochawesome 報告設定以下配置：

• overwrite - 如果其值為 false，則不應覆蓋先前生成的報告。

• reportDir - 這是儲存報告的位置。

• quiet - 如果其值為 true，則不應有與 Cypress 相關的輸出。只有 mochawesome 輸出需要列印。

• html - 如果其值為 false，則執行後不應生成 html 報告。

• json - 如果其值為 true，則會生成包含執行詳細資訊的 json 檔案。

在 cypress.json 中的實現

在 cypress.json 中 mochawesome 報告的實現如下：

{
   "reporter": "mochawesome",
   "reporterOptions": {
      "reportDir": "cypress/results",
      "overwrite": false,
      "html": false,
      "json": true
   }
}

要為 Cypress 專案 integration 資料夾中的所有規範生成報告，請執行以下命令：

npx cypress run

要執行特定測試，請執行以下命令：

npx cypress run --spec "<path of spec file>"

執行完成後，將在 Cypress 專案中生成 mochawesome-report 資料夾，其中包含 html 和 json 格式的報告。

右鍵單擊 mochawesome.html 報告。然後，選擇“複製路徑”選項，並在瀏覽器中打開復制的路徑。

mochawesome 報告將開啟，其中包含執行結果、持續時間、測試用例名稱、測試步驟等詳細資訊。

單擊螢幕左上角的圖示（在上圖中突出顯示），將顯示更多選項。

我們可以獲得不同的檢視來選擇已透過、已失敗、掛起、已跳過的測試用例以及應用於測試的鉤子。

JUnit 報告

Cypress 提供另一種型別的報告，稱為 JUnit 報告。

要安裝 JUnit 報告的包，請執行以下命令：

npm install cypress-junit-reporter --save-dev

您的電腦上將出現以下螢幕：

在 cypress.json 中的實現

以下是 cypress.json 中 JUnit 報告的實現：

{
   "reporter": "junit",
   "reporterOptions": {
      "mochaFile": "cypress/results/results.xml",
      "toConsole": true
   }
}

如果我們在一次執行中執行多個測試，並且希望為各個規範檔案生成唯一的報告，則必須在 cypress.json 中的 mochaFile 引數中新增 [hash]。

避免覆蓋報告的實現

以下是 cypress.json 中避免在 Cypress 中覆蓋報告的實現：

{
   "reporter": "junit",
   "reporterOptions": {
      "mochaFile": "cypress/results/results-[hash].xml",
      "toConsole": true
   }
}

要為 Cypress 專案 integration 資料夾中的所有規範生成報告，請執行以下命令：

npx cypress run --reporter junit

您的電腦上將出現以下螢幕：

執行完成後，將在 Cypress 專案中生成 results 資料夾，其中包含 xml 格式的報告。

TeamCity 報告

Cypress 提供另一種型別的報告，稱為 TeamCity 報告。

要安裝 TeamCity 報告的包，請執行以下命令：

npm install cypress-teamcity-reporter --save-dev

您的電腦上將出現以下螢幕：

要為 Cypress 專案 integration 資料夾中的所有規範生成報告，請執行以下命令：

npx cypress run --reporter teamcity

您的電腦上將出現以下螢幕：