Forum

Forum
Prevent overlapping...
 
Notifications
Clear all

[Solved] Prevent overlapping elements in full page screenshot with cypress

Anonymous
 Anonymous
New Member Guest
Joined: 2 weeks ago
Posts: 1
Topic starter  

We are trying ti implement Visual Testing with cypress and Imagium. The full page screen shot that we get contains multiple overlapping sticky headers. How can we handle this ?


   
admin
Member Admin
Joined: 2 years ago
Posts: 91
 

This is a typical problem with sticky headers. All you need to do is make a change to position css property of the sticky element as below:

cy.get('.sticky-header').invoke('css', 'position', 'absolute');
 cy.screenshot('Imagium/Image',{ overwrite: true });
cy.get('.sticky-header').invoke('css', 'position', null);

 

For more details see here