'Can cypress click on an element it cannot see?

I have an webpage (unfortunately I can't share as it's internal test one for my company) but essentially we have an item appear that has an "Accept" button for cookies, unfortunately I believe it's CSS so Cypress can't see the element if I use the selector and nor it cannot see the accept button.

Is there anyway around this?

I have tried using tab to get down to the element but as Cypress can't see the element it cannot click on it to initiate that.



Solution 1:[1]

You can add force: true with your click command for this.

cy.get('selector').click({force: true})

Solution 2:[2]

The easiest way is to select what the user can see, which is the "Accept" text on the button.

If it's visible on the page, Cypress can eventually find it but you have to design the command to retry which means adding some sort of .should() assertion on the element.

cy.contains("Accept")
  .should('be.visible')   // in case there's a delay in displaying the button
  .click()

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Alapan Das
Solution 2 Fody