Search code examples
htmlautomationcypress

How to click an element that is not visible in cypress


I am trying to click an action menu option and getting this error in cypress:

Timed out retrying after 4050ms: cy.click() failed because this element is not visible:
<div id="pay-off-holiday-option" class="ng-star-inserted">...</div>
This element <div#pay-off-holiday-option.ng-star-inserted> is not visible because its parent <div#ngx_poppperjs_63.ngxp__container.ngxp__animation.popper-actions> has CSS property: display: none
Fix this problem, or use {force: true} to disable error checking.

I have tried adding force:true on the click and it just moves the menu weirdly, rather than clicking on the element.

Here is how the dom looks like:

enter image description here


Solution

  • You have information on how you can workaround this problem. Add optional 'option' param.

    Element.click({force: true});
    

    There you can find more information: https://docs.cypress.io/api/commands/click#Usage