自動化測試，讓你上班擁有一杯咖啡的時間 | Day 7 — 如何寫斷言

此系列文章會同步發文到13th鐵人賽，有興趣的讀者可以前往觀看喔。

在測試腳本加上斷言後，當程式碼有 bug 時，一下就能被找出來。根據腳本的情境可以下幾種斷言，例如輸入錯誤應該要出現 xxx 訊息，填完資料某按鈕應該要出現。

寫斷言的方法有以下幾種：

1. Implicit Subjects: 使用 .should() 或 .and()
2. Explicit Subjects: 使用 .expect()

例如：

.should() 在點擊完按鈕，class name 應該要有 active：

cy.get('button').click().should('have.class', 'active')

.and() 可以一次寫多個斷言：

cy.get('#header a')
  .should('have.class', 'active')
  .and('have.attr', 'href', '/users')

.expect()

cy.get('tbody tr:first').should(($tr) => {
  expect($tr).to.have.class('active')
  expect($tr).to.have.attr('href', '/users')
})

動手寫程式

describe("鐵人賽搜尋功能", function () {
    beforeEach(() => {
      cy.login({ userId: "account", password: "password" });
    })
  
    it("搜尋cypress後，應該要有文章", function () {
      cy.get('.menu__search-toggle').click({force: true});  //點選搜尋
      cy.get('.menu__search-input').type('cypress')  //搜尋cypress
      cy.get('#searchIronman').click({force: true,}); //選擇鐵人賽
      cy.get('.menu__dropform-btn').click({force: true}); //點選搜尋
      cy.get(".search-qa-list__title-link").contains("自動化測試，讓你上班擁有一杯咖啡的時間 ").should("be.visible"); //要有cypress文章
      cy.get('li > a').contains("登出").click({force: true}); //點選登出
    })
})

腳本執行錯誤時，會提供明確的訊息。

參考資料

https://docs.cypress.io/guides/references/assertions#Adding-New-Assertions