如何迭代表并从行中提取值并与数据表进行比较

Question

我正在尝试填写表格并保存详细信息，然后相同的详细信息显示在表行中。我需要遍历表行并从该行中提取所有值（Value1、Value2、Value3），然后与输入值进行比较。我如何使用 cypress 来做到这一点？

<tbody class="jss1692">
    <tr class="jss1588">
        <td class="jss1598 jss1600 jss1593 jss1597 jss1693 jss1694 jss1696 jss1697 sc-jtRfpW bPusKc" style="left: 0px;">
            <div class="sc-kTUwUJ frEzXN">
                <div title="Draft" class="sc-jKJlTe gSOlpt">
                    <div data-testid="StatusLight" class="sc-eNQAEJ heHvgs"></div>
                </div>
            </div>
        </td>
        <td class="jss1598 jss1600 jss1593 jss1597 jss1696 sc-dqBHgY eAlZOZ">
            <div class="sc-elJkPf epzdvI">Value1</div>
        </td>
        <td class="jss1598 jss1600 jss1593 jss1597 jss1696 sc-dqBHgY eAlZOZ">
            <div class="sc-elJkPf epzdvI">Value2</div>
        </td>
        <td class="jss1598 jss1600 jss1593 jss1597 jss1696 sc-dqBHgY eAlZOZ">
            <div class="sc-elJkPf epzdvI">Value3</div>
        </td>
    </tr>
</tbody>

Answer 1

您需要迭代 td 元素并提取文本内容。因为我使用.find('td')它查找所有 td 元素，并且.each()您可以逐一迭代它们，选择所需的元素（在本例中，我跳过索引为 0 的元素，因为它只是一个空字符串）：

let values = []
cy.visit('stackoverflow/table.html')
cy.get('tbody > tr')
  .find('td')
  .each(($el, $index) => {
     cy.wrap($el)
      .invoke('text')
      .then(text => {
          if($index!==0)
            values.push(text.trim())
          })
       })
      .then(() => expect(values).to.deep.eq(["Value1", "Value2", "Value3"]))