赛普拉斯：如果找到匹配的文本，如何单击数组列表元素答案

【问题标题】：Cypress: How to click on a array-list element if matching text found赛普拉斯：如果找到匹配的文本，如何单击数组列表元素
【发布时间】：2021-10-24 10:17:11
【问题描述】：

我想在购物车中添加一个带有匹配文本（如“腰果”）的商品。我尝试了下面的代码，但 .click() 函数将错误作为“绑定和事件处理程序到 click javascript 事件”

cy.get('.products').find('.product').each(($e1, index, $list) => {
  const textveg = $e1.find('h4.product-name').text() {
    if (textveg.includes('Cashews')) {
      $e1.find('.button').click();
    }
  }
})

有人可以建议 .click() 方法未被赛普拉斯识别的可能原因是什么。我正在使用 cypress 版本 7

【问题讨论】：

标签： cypress

【解决方案1】：

您可以使用.filter() 找到您的元素并单击它：

cy.get('h4.product-name').filter(':contains("Cashews")').click()

【讨论】：

【解决方案2】：

如何做到这一点取决于 HTML 的结构。

看起来你可能有这种层次结构

<div class="products">

  <div class="product">
    <h4 class="product-name">Almonds</h4>
    <button>Add to cart</button>
  </div>

  <div class="product">
    <h4 class="product-name">Cashews</h4>
    <button>Add to cart</button>
  </div>

</div>

选择包含您想要的文本的产品部分，并在其中找到产品<button>。

你的测试可能是

cy.contains('.product', 'Cashews')  // pick the <div class="product"> with required text
  .find('button')                   // inside the product, find it's button
  .click()

【讨论】：