使用 Cypress 验证 CSS 'backgroud-image' URL

Question

我正在尝试验证CSS"background image"URL的状态代码是否为"200"。是否可以使用Cypress验证图像加载。有人能提出建议吗？

it('Validate the images displayed',() => {
cy.get('.logo').each(($el,index,$list) => {
expect($el).to.have.css('background-image','*should pass dynamic url image*')     
})

Answer 1

获取元素后，可以使用JQuery函数返回background-imagecss值($el.css('css-property')(，并在验证其为200的cy.request()函数中使用该值。

it('Validate the images displayed',() => {
cy.get('.logo').each(($el) => {
// $el.css('background-image') => may take some formatting to be just right, depending on what is returned by that function.
cy.request($el.css('background-image')).then((res) => {
expect(res.statusCode).to.eql(200);
});     
});
});