赛普拉斯 - 验证一列中的每个 table 行是否包含相同的项目

Cypress - verify if each table row in one column contains the same item

我有一个 table,但是由 DIV 创建的某种农业网格,不是真正的 table 元素:

<div role="row" row-index="1" >
<div col-id="name">Name 1</div>
<div col-id="age">25</div>
</div>

<div role="row" row-index="2" >
<div col-id="name">Name 1</div>
<div col-id="age">25</div>
</div>

我想验证 col-id="name" 的每个字段是否包含相同的项目。我正在测试一种过滤,所以如果用户过滤 Name 1,我想检查每一行,如果只有 Name 1 而没有其他。

由于我需要检查的每个字段都有相同的col-id,所以我这样尝试:

cy.get('div[col-id="name"]').contains('Name 1')

cy.get('div[col-id="name"]').should('contain','Name 1')

但即使某些字段包含另一个名称,这两种情况都会通过,因为它至少找到一个匹配项。

如何断言具有 col-id="name" 的每个字段应仅包含名称 1?

也许使用 .each() 单独测试元素

cy.get('div[col-id="name"]')
  .each($el => {
    expect($el.text()).to.eq('Name 1')
  })

没有.each()

cy.get('div[col-id="name"]')
  .should($els => {
    const names = [...$els].map(el => el.innerText)
    expect(names.every(name => name === 'Name 1').to.eq(true)
  })

您可以验证所有元素的组合文本

cy.get('div[col-id="name"]')
  .invoke('text')
  .should('eq', 'Name 1'.repeat(2))  // assuming two elements, equals "Name 1Name1"

或者,这更适合异步获取名称

cy.get('div[col-id="name"]')
  .should('have.text', 'Name 1'.repeat(2))  // equals "Name 1Name1"

当元素数未知时

cy.get('div[col-id="name"]')
  .then($els => {
    const count = $els.length
    cy.wrap($els).should('have.text', 'Name 1'.repeat(count))  
  })

如果您不想应用断言而只是打印出声明元素是否 found/not 找到的语句,您可以这样做:

cy.get('div[col-id="name"]').each(($ele, index) => {
  if ($ele.text().trim() == 'Name 1') {
    cy.log('Item Found at position ' + index)
  } else {
    cy.log(
      'Expected Item Not found at position ' +
        index +
        '. Instead the item was ' +
        $ele.text().trim()
    )
  }
})