无法使用Cypress.io测试页脚的背景颜色，它会抛出错误

Question

无法使用赛普拉斯.io测试背景颜色，它会在运行柏树测试时抛出以下错误; CypressError：超时重试：actual.equals不是函数。通过npm install chai-colors安装chai-colors并在/ support / index.js下添加

import chaiColors from 'chai-colors'
chai.use(chaiColors)

柏树测试如下：

describe("Background Color test", () => {
  //before(() => {
  //  cy.visit('https://sometesturl.com')
//  })
  it.only('Verify the backgroud color, this should work', () => {
     cy.visit('https://sometesturl.com')
      cy.get('#footer')
        .should('colored', '#f2e47d')
        .and('be.colored', '#f2e47d')
  })
})

Answer 1

我尝试使用与颜色＃f2e47d相对应的'eq'和'rgb'值。在下面的链接中，来自cypress.io的'brian-mann'肯定说'匹配'总是用于正则表达式。 https://github.com/cypress-io/cypress/issues/58现在，测试成功断言了页脚区域中的背景颜色值。

describe("Background Color test", () => {
  it.only('Verify the backgroud color, this should work', () => {
     cy.visit('https://sometesturl.com')
     cy.get('#footer')
       .should('have.css', 'background-color')
       .and('eq', 'rgb(242, 228, 125)')
  })
})

Answer 2

chai-colors只测试不同颜色表示的相等性。

要测试你的#footer元素是否具有某种背景颜色，你需要使用Cypress css()断言。

describe("Background Color test", () => {
  it.only('Verify the backgroud color, this should work', () => {
     cy.visit('https://sometesturl.com')
     cy.get('#footer')
       .should('have.css', 'background-color')
       .and('eq', 'rgb(242, 228, 125)')
  })
})