掌握 Cypress API 測試：附有範例的綜合指南

應用程式介面，通常稱為 API，是軟體開發生命週期的重要方面，不僅從開發的角度來看，而且從測試的角度來看。這些 API 促進不同系統之間的互動以交換資料。因此，徹底測試這些 API 以確保應用程式的無縫運作變得極為重要。

在本文中，我們將探索使用 Cypress 測試框架進行 API 測試，並了解如何自動化 API 來進行高效測試。我們將在本文中介紹以下幾點 -

API 檢定概述

API 測試涉及向後端伺服器發送 HTTP 請求（無論是 GET、POST、PUT、DELETE（或其他方法））並檢索回應。一旦檢索到回應，就會對其進行驗證以確保已收到預期值。以下列出了 API 測試的一些關鍵面向

• 驗證狀態代碼 – 對回應中的狀態代碼進行驗證，以確保收到所需的狀態代碼。例如，需要 200 個狀態代碼才能確保成功。您可以參考 wiki 文件中用於 HTTP 請求的其他標準狀態碼。
• 回應正文斷言 – 驗證 HTTP 回應正文，以確保 XML 或 JSON 包含預期資料並具有正確的結構。
• 測試請求參數 – 透過在參數和標頭中傳遞不同的值來驗證 API 的行為。
• 身份驗證和授權 - 驗證正確的身份驗證機制和安全方面。 在測試 API 時，考慮上述幾點以確保 API 的端對端功能沒有錯誤。

利用 Cypress 進行 API 檢定

Cypress 是一種流行的前端測試工具，用於瀏覽器和端到端自動化測試。 Cypress 具有網路請求功能，這使其成為 API 測試的好選擇。 Cypress 為 API 測試提供的一些關鍵功能是 -

• 語法熟悉 – 與 UI 測試類似，Cypress API 指令使用相同的 .should() 和 .then() 語法。
• 內建斷言 –我們可以輕鬆地使用 Cypress 提供的斷言來斷言 API 請求的狀態代碼、標頭甚至回應正文。
• 重試失敗的請求 –Cypress 會自動重試失敗的請求，以確保沒有網路或其他類似問題。

詳細的文件 –Cypress 擁有詳細記錄的請求和斷言，可以輕鬆獲得運行支援。

Cypress API 測試的主要特點

Cypress 具有多種功能，可協助您有效且有效率地執行 API 測試。以下討論一些功能 -

• cy.wait() – 提供等待網路請求的機制，並協助載入非同步資料。
• cy.route() – 協助將測試請求路由到特定處理程序。
• cy.server() – 幫助維護測試套件的整個伺服器。
• 測試運行者 – 幫助並行執行測試以實現快速週轉時間。
• cy.login() – 透過在呼叫之前使用單一指令設定授權標頭來協助發出安全的 API 請求。
• cy.intercept() – 控制回應，或透過攔截請求來模擬行為。 有了這些功能，使用者就可以非常輕鬆方便地開始編寫具有增強功能和高效框架的 API 測試。

現在我們了解了 Cypress 如何幫助自動化我們的 API，讓我們使用 Cypress 編寫一個簡單的 API 測試。但在此之前，您需要確保滿足以下先決條件 -

• 安裝 Visual Studio 等 IDE（這是最常用的 IDE，但您也可以參考其他 IDE，例如 IntelliJ）
• 在系統中安裝 Node.js 現在讓我們逐步完成使用 Cypress 編寫第一個 API 測試的步驟。

使用 Cypress 寫第一個 API 檢定

在本文中，我們將介紹使用 GET、POST、PUT 和 DELETE 方法發送 HTTP 請求的簡單場景。但在開始編寫測試腳本之前，我們將設定環境。

1. 在您的系統本機建立一個資料夾，我在我的系統中建立了一個名為 CypressAPITests 的資料夾。

柏樹 API
2.接下來，開啟 Visual Studio Code 編輯器並開啟在步驟 #1 中建立的資料夾。

3.現在您已經開啟了該資料夾，下一步是設定節點項目。為此，請在終端機中使用命令 npm init -y，這將建立一個 package.json 檔案。

4.現在，我們將使用命令 npx cypress install 從終端機安裝 Cypress（如果尚未安裝）。

5.現在，我們將為測試建立設定文件，為此，我們將在終端機中運行命令 npx cypress open。

6. Cypress 工具開啟後，選擇 E2E 測試。

7.點選下一個畫面上的「繼續」。

8.設定檔設定完成後，回到 Visual Studio Code 編輯器，您將看到設定檔已建立。

9.至此Cypress已經安裝成功，環境也已經搭建完畢。我們現在將開始編寫測試。

我們將使用一些虛擬 API 呼叫來示範 Cypress API 自動化。

在 Visual Studio Code 編輯器中，在 Cypress 目錄下建立一個資料夾 e2e。在 e2e 資料夾下，您可以建立另一個名為 APITests 的資料夾。請注意，您可以根據需要選擇資料夾名稱。

現在我們將開始編寫我們的第一個測試文件。我們將在 APITests 資料夾下建立一個檔案。我們將其命名為 HttpGetRequest。該檔案名稱的副檔名為 .cy.js，如下面的快照所示 -

現在我們開始編寫主要程式碼。在此之前，讓我們先來看看請求的基本語法 -

cy.request(METHOD,url,body)

在使用 Cypress 發出的請求中，url 是必填參數，但 Method 和 body 等其他參數是可選的。您可以查看 Cypress 官方文件中的不同請求語法，以更好地了解我們如何以不同的方式使用它。

在我們的範例場景中，我們將使用 GET 方法來取得一些資源，因此我們將使用 Method 和 url 作為 cy.request 的參數。

cy.request('GET','https://dummy.restapiexample.com/api/v1/employees')
此命令將對伺服器進行 API 呼叫。

接下來，我們將斷言一些回應值，例如狀態碼。

.its('狀態')
.should('等於',200);
這行程式碼將驗證回應狀態碼並斷言其值為 200。

讓我們看看這段程式碼組合在一起後的樣子：

描述('HTTPGet',()=>{

it('GET 請求',()=>{

cy.request('GET','https://dummy.restapiexample.com/api/v1/employees')
.its('狀態')
.should('等於',200);

})

})
編寫完 GET 請求的程式碼後，我們將執行相同的操作。要執行它，我們可以使用兩種方式中的任何一種 -

1. 透過終端執行
2. 透過Cypress工具執行 我們將一一看看如何執行。

透過終端執行

要透過終端機執行 Cypress 程式碼，請開啟終端機視窗並簡單地傳遞命令：

npx cypress run –spec「檔案路徑」

在上面的命令中，檔案路徑是您要執行的檔案的相對路徑。下面的快照顯示了 HTTPGetRequest 檔案在我的系統上的執行情況 -

可以看到測試執行成功，我們的API測試已經通過了。

現在讓我們嘗試透過 Cypress Tool 執行相同的測試。

透過 Cypress 工具執行

1.只需編寫指令 npx cypress open 即可開啟工具。

1. 看到工具視窗開啟後，按一下「E2E 測試」。

1. 現在選擇任意瀏覽器。我選擇 Electron。

1. 您將看到 Electron 瀏覽器打開，並顯示我們編寫的 Visual Studio Code 規格。

1. 選擇 HttpGetRequest，您將看到執行開始並顯示日誌。

您已經執行了第一個 Cypress API 自動化測試。我們現在將增強程式碼以執行其他幾個 HTTP 方法。

POST 方法

執行 POST HTTP 請求的程式碼-

描述('HTTPGet',()=>{

it('POST 請求',()=>{
cy.request({
方法：'POST'，
url: 'https://dummy.restapiexample.com/api/v1/create',
正文：{
"name":"測試貼文",
"工資":"1234",
"年齡":"23"

}
})
.its('狀態')
.should('等於',200);
})
})
執行上述程式碼後，日誌將顯示執行結果，如下所示-

在接下來的示範中，我們將使用另一個假 API 集合，並了解 HTTP 請求方法如何為它們運作。

PUT 方法

執行 PUT HTTP 請求的程式碼-

描述('HTTPPut',()=>{

it('PUT 請求',()=>{
cy.request({
方法: 'PUT',
url: 'https://jsonplaceholder.typicode.com/posts/1',
正文：{
id: 1,
title: '這是 PUT 更新',
body: '這是 PUT 更新正文',
使用者 ID: 1,
}
})
.its('狀態')
.should('等於',200) ;
})
})

上面程式碼的執行結果顯示在下面-

刪除方法

執行刪除 HTTP 請求的程式碼（請注意，我在上面使用的相同範例中附加了以下程式碼段）-

it('刪除請求',()=>{
cy.request({
方法：'刪除'，
url: 'https://jsonplaceholder.typicode.com/posts/1',
})
.its('狀態')
.should('等於',200) ;
})
由於 PUT 和 DELETE 請求都在同一個檔案中，因此這兩個方法都被執行，結果如下所示 -

所以，就是這樣，您現在知道如何使用 Cypress 執行不同方法的基本 HTTP 請求。現在您可以繼續嘗試在您的專案中實作 Cypress API 測試，看看您能夠如何輕鬆地以快速週轉時間測試 API。

結論

在了解了 API 和 Cypress 的 API 測試基礎知識後，我們得出以下幾點結論 -

1. Cypress API 測試提供了一組強大的工具，可幫助您熟悉 Cypress 的 UI 測試語法。
2. 我們可以方便地使用斷言來驗證回應狀態碼和任何其他回應參數。

資料來源：本文原刊於 testgrid.io。

以上是掌握 Cypress API 測試：附有範例的綜合指南的詳細內容。更多資訊請關注PHP中文網其他相關文章！