使用 Cypress 在表中断言排序

Question

好吧，我有一个包含许多行和列的表，我想检查该表是否针对特定列进行了排序。

我尝试过使用不同的期望和断言，但它总是返回true。我在这里做错了吗？

cy.get('table tbody tr').should(function($trs) {
  var arrayOftd = $trs.map(function (i, tr) {
    return Cypress.$(tr).find('td').eq(3).text() 
  })
  var test = arrayOftd.sort()          
  expect(arrayOftd).to.deep.equal.(test)
})

升序时必须返回true，降序或其他顺序时必须返回false。

这是断言语句的控制台日志

命令：断言 cypress_runner.js:172385 实际：(13) [“946”、“947”、“948”、“951”、“952”、“955”、“956”、“959”、“960”、“963” , "964", "967", "968"] cypress_runner.js:172385 预期：(13) [“946”、“947”、“948”、“951”、“952”、“955”、“956”、“959”、“960”、“963” , "964", "967", "968"] cypress_runner.js:172385 消息：预期 [ Array(13) ] 等于 [ Array(13) ] cypress_runner.js:172385 错误：AssertionError：预期 [Array(13)] 等于 [Array(13)]

Answer 1

tl;博士

你必须在 sort 之前 copy the array 否则你自己断言它，因为 sort 改变了数组。

var test = arrayOftd.slice().sort()

说明

sort 不会返回新副本，它会更改数组 in-place，因此当您将其返回值分配给 test 并将其与 arrayOftd 进行比较时，您会将其与自身进行比较。

引用MDN docs：

sort() 方法对数组in place 的元素进行排序并返回排序后的数组。

请记住，slice 不会创建数组的深层副本，它只会复制其第一级，但如果您仅更改第一级的顺序，应该没问题。

Answer 2

这可能是个人喜好，但如果我真的不需要，我尽量不使用 jQuery 语法，以提高可读性。我所做的是：

function getCellTextAsArray() {
  let cellContents = [];
  return new Cypress.Promise(resolve => {
    cy.get("table tbody tr")
      .children()
      .each(($el, $index) => {
        //some logic to select the elements you want
        //like $index % 4 == 0
        if (...) {
          cellContents.push($el.text());
        }
      })
      .then(() => resolve(cellContents));
  });
}

然后你就不用担心传递回调了：

getCellTextAsArray().then(cellContents => {
  let actual = cellContents.slice();
  cy.wrap(actual).should("deep.eq", cellContents.sort());
});

所以这里发生的情况是，我们正在尝试使用更高级别的 Cypress 命令来获取所有 tds，当我们完成它们时，我们使用 tds 文本内容解决 Promise，然后它就变得简单易读了最后的断言。