Skip to main content
Cypress应用

each

遍历类数组结构（数组或具有length属性的对象）。

在.each()之后继续链式调用依赖于该主题的命令是不安全的。

语法​

.each(callbackFn)

用法​

正确用法

cy.get('ul>li').each(() => {...}) // 遍历每个'li'
cy.getCookies().each(() => {...}) // 遍历每个cookie

错误用法


cy.each(() => {...})            // 错误，不能从'cy'开始链式调用
cy.clock().each(() => {...})    // 错误，'clock'不返回数组

参数​

callbackFn (函数)

传入一个函数，该函数接收以下参数：

  • value
  • index
  • collection

生成结果 了解主题管理​

  • .each()返回与传入时相同的主题。
  • 在.each()之后继续链式调用依赖于该主题的命令是不安全的。

示例​

DOM元素​

遍历DOM元素数组

cy.get('ul>li').each(($el, index, $list) => {
  // $el是一个包装的jQuery元素
  if ($el.someMethod() === 'something') {
    // 包装该元素以便我们可以
    // 在其上使用Cypress命令
    cy.wrap($el).click()
  } else {
    // 执行其他操作
  }
})

始终返回原始数组

无论回调函数返回什么，.each()始终返回原始数组。

cy.get('li')
  .should('have.length', 3)
  .each(($li, index, $lis) => {
    return 'something else'
  })
  .then(($lis) => {
    expect($lis).to.have.length(3) // true
  })

Promise​

等待Promise

如果回调函数返回一个Promise，在遍历集合中的下一个元素之前会等待该Promise完成。

cy.wrap([1, 2, 3]).each((num, i, array) => {
  return new Cypress.Promise((resolve) => {
    setTimeout(() => {
      resolve()
    }, num * 100)
  })
})

注意事项​

提前返回​

提前停止each循环

通过在回调函数中返回false，可以提前停止.each()循环。

规则​

要求 了解命令链​

  • .each()需要链式调用在前一个命令之后。

断言 了解断言​

  • .each()只会运行一次你链式调用的断言，不会重试。

超时设置 了解超时机制​

  • .each()可能会因等待你返回的Promise解析而超时。

命令日志​

  • cy.each()不会在命令日志中记录

另请参阅​

目录