Cypress如何实现弹窗存在时点击确认按钮的条件测试？

原代码失效原因 #

你的代码执行cy.get('body')时，目标弹窗大概率还未完成DOM渲染，此时同步执行的body.find()无法匹配到还没出现的按钮，会直接跳过判断分支，逻辑自然不会触发。将入参重命名为$body只是jQuery对象的命名规范调整，并没有解决时序不匹配的核心问题。

可行实现代码 #

基础版（直接匹配确认按钮） #

给查询命令添加超时等待和不报错配置，保证给足弹窗渲染时间，匹配不到也不会中断测试：

cy.get('button.swal2-confirm:contains("Yes")', { 
  timeout: 3000, // 可根据实际页面加载速度调整最长等待时间
  failOnError: false 
}).then($confirmBtn => {
  if ($confirmBtn.length > 0) {
    cy.wrap($confirmBtn).click()
  }
})

精准版（先匹配弹窗标题避免误触） #

如果页面可能出现多个SweetAlert2弹窗，可先匹配指定标题的弹窗再找按钮：

// 先匹配标题为"You are about to leave this page"的弹窗容器
cy.get('.swal2-container:has(h2:contains("You are about to leave this page"))', {
  timeout: 3000,
  failOnError: false
}).then($alertContainer => {
  if ($alertContainer.length > 0) {
    cy.wrap($alertContainer).find('button.swal2-confirm:contains("Yes")').click()
  }
})

注意事项 #

• timeout参数请根据你的项目实际弹窗弹出延迟调整，避免还没等到弹窗弹出就结束判断
• failOnError: false配置是核心，只有设置后元素不存在时才不会直接抛出测试失败错误

内容的提问来源于stack exchange，提问作者Darksymphony