Checking transform with cypress

user_3913905 0
Viewed 2231

I'm new to cypress and I'm trying to check that one of my elements contains a specific style. The element is something like this: 

<div class="myElement" style="transform: translate(0%, 0px); "></div>

An this is my assertion: 

cy.get('.myImage').should("have.css", "transform", "translate(0%, 0px)");

This assertion is not working, but I cannot figure out why, cypress says: 

expected <div.myImage> to have CSS property transform with the value translate(0%, 0px), but the value was none

What am I doing wrong?

cypress reactjs javascript
1 Answers

Cypress' have.css uses chai-jquery which asserts computed value.

Thus, even though you've assigned translate(0%, 0px), it gets computed as none.

Alternatively, you could use assert like this:

cy.get('.myImage').should('have.attr', 'style').should('contain', 'transform: translate(0%, 0px)')
user_9276310
Related