赛普拉斯 - 迭代每个元素并在移动到下一个迭代/元素之前执行一些操作

Question

我在 cypress 中遇到以下问题：

获取包含按钮的特定列的所有 table 个单元格。
遍历每个单元格 --> 在该单元格中找到按钮。
点击那个按钮。
等待模式对话框出现
接受模态并等待它消失。
等待通知出现然后消失。
移动到下一个单元格元素/迭代

我目前拥有的代码：

cy.get("tr[some attribute]").each(($element, $index, $list) => {
cy.wrap($element).find("button").click();
cy.get(".modal-dialog").should('be.visible');
cy.get(".modal-dialog button[type='submit']").should('be.visible').click();
cy.get("toast").should('be.visible').as('@toast')
cy.get('@toast').should('not.be.visible')
})

这里的问题：

柏树不会等待第一次迭代完成并运行所有迭代。我可以看到打开了多个模态对话框。
Cypress 异步点击所有按钮，无需等待上一次迭代完成。
尽管我可以看到 toast 消息不存在，但 cypress 在它期望 toast 消失的步骤上失败了。

提前致谢！

Answer 1

我运行一个带有模态和 toast 的简单应用程序。如果您修复了测试的 toast 部分，则可以使用 .each()

迭代行

要修复 toast，您需要删除别名并 cy.get('toast') 第二次。

别名值存储在内部，不会在should()执行重试时改变。请记住，toast 会在屏幕上停留几秒钟，因此您必须使用重试来测试它是否消失。（您可能需要根据 toast 持续时间增加超时）。

修复的最小更改：

cy.get("tr[some attribute]").each(($row) => {
  cy.wrap($row).find("button").click();
  
  cy.get(".modal-dialog").should('be.visible');
  cy.get(".modal-dialog button[type='submit']").should('be.visible').click();

  cy.get("toast").should('be.visible')
  // timeout must exceed toast auto-close period
  // if you run the test in background or in CI, allow a few seconds extra
  cy.get('toast', {timeout:10000}).should('not.be.visible') 

})

我一次只在屏幕上显示一个 toast，迭代等待 cy.get('toast', {timeout:10000}).should('not.be.visible') 完成。

Answer 2

1/2。从外观上看，您似乎正在获取所有行，然后遍历每一行。如果按钮 html 元素仅存在于您声明的列中，那么您将 .find() 命令移动到 .each().

上方

如果您仅将别名用于紧接在别名集之后的命令，则别名似乎有点不必要。同样从 v6.0.0 开始，断言应该是 not.exist.

您的更新代码应如下所示。

cy.get("tr[some attribute]")
  .each( $row => {
     cy.wrap($row)
       .find("button[type=submit") // get only cell with button type submit
       .should('be.visible') // may want to play around with command timeouts based on your button appearing
       .click()
     cy.get(".modal-dialog")
       .should('be.visible') // modal appears
       .find(button[type='submit']")
       .should('be.visible') // button appears in modal
       .click();
     cy.get("toast").should('be.visible') 
     cy.get("toast").should('not.exist') // no exist in DOM
})

赛普拉斯 - 迭代每个元素并在移动到下一个迭代/元素之前执行一些操作

Cypress - Iterate over each element and perform some action before moving to next iteration / element

cypress