Cypress web自動化38-alert 彈窗 cy.on('window:alert', stub)

前言

當頁面上出現 alert 彈窗時候，Cypress 自動接受 alert， 運行代碼的時候雖然看不到彈窗頁面，但是依然可以對文本內容斷言

Alert 彈窗

Cypress 自動接受 alert，但您仍然可以對文本內容進行斷言，使用示例

// app code
$('button').on('click', (e) => {
  alert('hi')
  alert('there')
  alert('friend')
})

it('can assert on the alert text content', () => {
  const stub = cy.stub()

  cy.on('window:alert', stub)

  cy
    .get('button').click()
    .then(() => {
      expect(stub.getCall(0)).to.be.calledWith('hi')
      expect(stub.getCall(1)).to.be.calledWith('there')
      expect(stub.getCall(2)).to.be.calledWith('friend')
    })
})

百度搜索案例

百度-搜索設置-保存設置，彈出alert

/**
 * Created by dell on 2020/6/9.
 * 作者：上海-悠悠 交流QQ群:939110556
 */

describe('baidu alert', function() {

    before( function() {
        cy.visit("https://www.baidu.com/")

        cy.get("#s-usersetting-top").trigger('mouseover')  // 鼠標懸停
        cy.contains("搜索設置").click()
    })


    it('assert alert text', () => {
      const stub = cy.stub()
      cy.on('window:alert', stub)

      cy
          .contains("保存設置").click()
          .then(() => {
          expect(stub.getCall(0)).to.be.calledWith('已經記錄下您的使用偏好')
        })
    })

    })

運行結果