在 Cypress 中，如何测试某个属性是否等于多个值之一？

Question

我们正在赛普拉斯的一个网站上运行一些测试。在 Windows 上的 Chrome 中，测试全部通过。然而，在 Mac 上，某些元素的宽度比 Windows 上宽 2 像素。我知道情况不应该如此，我们将单独调查这一点，但我想知道的是如何测试测试的值是否应落入某个值范围内？

这是在 Windows 中通过的测试：

it('checks Headline container, width & horizontal spacing', () => {
  cy.get('[data-cy=headline]')
    .should('have.css', 'width', '569px')
})

这个是在 Mac 上通过的。唯一的变化是宽度571px改为569px。

it('checks Headline container, width & horizontal spacing', () => {
  cy.get('[data-cy=headline]')
    .should('have.css', 'width', '571px')
})

考虑到实际should()测试是针对字符串的，您将如何测试宽度是否是两个字符串中的一个？还是实际的值范围？

Answer 1

你可以用closeTo它。它看起来像这样：

it('checks Headline container, width & horizontal spacing', () => {
  cy.get('[data-cy=headline]')
    .then($element => {
    expect($element.width())
      .closeTo(569, 2)
    })
})

第一个数字closeTo是希望的数字，第二个数字是余量。例如：如果你有.closeTo(600, 150)实际数字应该在 450 到 750 之间。所以这不是一个非常具体的检查。