search

jaredpalmer / cypress-image-snapshot

Catch visual regressions in Cypress
MIT License
891 stars 158 forks source link

How to take screenshot of a particular element and ignore remaining sections #119

Closed nani554 closed 4 years ago

nani554 commented 4 years ago

I have tried using blackout option but the image doesn't look good. please provide me an option to select only particular element to take a screenshot

versions:

"dependencies": { "cypress": "^3.8.3", "cypress-image-snapshot": "^3.1.1" }

nani554 commented 4 years ago

I found cy.get('.someClass').matchImageSnapshot(); as working solution. But iam looking for any other good solution. please close this issue if you feel there aren't any more solutions other than above one. thank you

louis-vinchon commented 4 years ago

That's the correct way to do it.

mdo5004 commented 4 years ago

That is the documented way to do it, although I can't get it to work with some elements (e.g modals). I am using instead cy.get('.someClass').matchImageSnapshot({ clip: { x: 123, y: 123, width:123, height: 123 } });

mdo5004 commented 4 years ago

I figured out why I was having issues with capturing modal screenshots. The element returned from cy.get('#my-modal') was, in fact, taking up the whole screen. The element I really wanted was its child.