Cypress 是一款強大的端到端測試工具,提供一組強大的內建指令來與 Web 應用程式互動。但是,每個項目都有獨特的需求,預設命令集可能無法完全滿足這些需求。這就是自訂命令的用武之地。自訂命令可讓您擴展賽普拉斯的功能,使您的測試更具可讀性和可維護性。在這篇文章中,我們將探討如何在 Cypress 中建立和使用自訂命令來增強您的測試自動化框架。
自訂指令有幾個好處:
在我們深入建立自訂指令之前,讓我們先設定一下 Cypress(如果您還沒有設定的話):
npm install cypress --save-dev
安裝完成後,開啟Cypress:
npx cypress open
Cypress 自訂指令在 cypress/support/commands.js 檔案中定義。讓我們透過一些範例來了解如何建立和使用自訂命令。
範例1:登入指令
假設您有一個需要經常互動的登入表單。您可以建立自訂命令來處理登入過程:
// cypress/support/commands.js Cypress.Commands.add('login', (email, password) => { cy.visit('/login'); cy.get('input[name=email]').type(email); cy.get('input[name=password]').type(password); cy.get('button[type=submit]').click(); });
現在,您可以在測試中使用登入命令:
// cypress/integration/login.spec.js describe('Login Tests', () => { it('Should login with valid credentials', () => { cy.login('test@example.com', 'password123'); cy.url().should('include', '/dashboard'); }); });
範例 2:帶有斷言的自訂指令
您也可以將自訂斷言新增至命令中。讓我們建立一個命令來檢查元素是否可見並包含特定文字:
// cypress/support/commands.js Cypress.Commands.add('shouldBeVisibleWithText', (selector, text) => { cy.get(selector).should('be.visible').and('contain.text', text); });
測驗中的用法:
// cypress/integration/visibility.spec.js describe('Visibility Tests', () => { it('Should display welcome message', () => { cy.visit('/home'); cy.shouldBeVisibleWithText('.welcome-message', 'Welcome to the Dashboard'); }); });
Cypress 中的自訂命令提供了一種強大的方法來擴展框架的功能,使您的測試更具可重用性、可維護性和可讀性。透過封裝常見操作並新增自訂斷言,您可以簡化測試自動化流程並專注於最重要的事情:確保您的應用程式完美運作。
立即開始在您的 Cypress 專案中實作自訂命令,看看它們可以在您的測試工作流程中帶來的變化。測試愉快!
以上是使用自訂命令增強您的賽普拉斯測試的詳細內容。更多資訊請關注PHP中文網其他相關文章!