Reputation: 532
I have a test that requries me to login but I need to be able to dismiss the cookies prompt first. I have an ID for the button and it is always visisble yet Cypress can never find it, why?
cy.visit('/signin')
cy.get('button[id="save"]').click() // Dismiss cookies prompt
Here is the button HTML:
<button _ngcontent-kbm-c55="" mat-button="" id="save" class="mat-focus-indicator solo-button mat-button mat-button-base mat-raised-button" tabindex="0" style="color: white; background-color: rgb(128, 70, 241);"><span class="mat-button-wrapper"><div _ngcontent-kbm-c55="" class="action-wrapper" style="font-size: 14px;"><span _ngcontent-kbm-c55="">Accept all cookies</span></div></span><span matripple="" class="mat-ripple mat-button-ripple"></span><span class="mat-button-focus-overlay"></span></button>
Error:
Timed out retrying after 10000ms: Expected to find element: button[id="save"], but never found it.
Upvotes: 0
Views: 3119
Reputation: 18601
Assuming there are no shadow DOM's or Iframes you can use contains
with the inner text of the button and click your button:
cy.contains('Accept all cookies').click()
A more better approach would be to use a combination of selector and innertext.
cy.contains('span', 'Accept all cookies').click()
In case of an iframe:
Install the cypress-iframe plugin
Add import 'cypress-iframe';
in your cypress/support/commands.js
You can add in the test:
cy.iframe('#frame-id').contains('Accept all cookies').click()
Upvotes: 1