how to test all page elements rendered on their place on blog where images are changing with cypress

Question

i want to add testing with cypress for my blog page where images are keeps on changing and i am not able to use visual test plugins shared by cypress. These test failing with images changed. I tried with cypress-plugin-snapshot.

Is there any plugin which can help me to test all page elements are rendered at their place. Page structure is as expected?

May be you can have example of image below - just for reference. What inside a block is not necessary but block need to be tested rendered within expected distentions.

Image content may change but whole page layout is rendered as expected. Eg. may be a img styling forgot to add width 100% and it's getting rendered as per actual image width.

Answer 1

You can validate pictures src attributes like this:

cy.get('img').should('have.attr', 'src', '/location.png')