Cypress循环遍历元素满足条件返回true否则返回false的实现问题

问题根因 #

你遇到的问题本质是Cypress 所有命令均为异步执行，cy.get()、.each() 都会被加入 Cypress 的命令队列延后执行，不会阻塞后续同步代码的运行。因此你的 return flag 语句会在 .each() 完成遍历、修改 flag 值之前就执行，自然永远返回初始值 0。

解决方案 #

不要尝试返回同步的判断结果，需要适配 Cypress 的异步机制，返回 Cypress 命令链，调用方通过 .then() 获取最终的布尔结果。

正确的实现代码如下：

getProfilePresentOrNot(profileName) {
  return cy.get('li>div>div>span').then($spanList => {
    // 直接用数组some方法判断是否存在匹配项，无需手动维护flag变量
    return [...$spanList].some(el => el.innerText.includes(profileName))
  })
}

调用方式示例：

getProfilePresentOrNot('目标名称').then(isExist => {
  // 此处的isExist就是最终判断结果，true为存在，false为不存在
  // 后续业务逻辑写在这里
})

如果你的目的只是做存在性断言，无需拿到判断结果做其他逻辑，可以直接用 Cypress 内置断言简化代码，不需要自己封装遍历逻辑：

// 断言存在包含指定文本的元素
cy.get('li>div>div>span').should('contain.text', profileName)
// 断言不存在包含指定文本的元素
cy.get('li>div>div>span').should('not.contain.text', profileName)

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