CODEWITHSUNDEEP
javascriptcypress
IBrito
IBrito

Reputation: 67

Clicking button in cypress does not have any effect

When cypress clicks the button it seems the click does not have any effect, because clicking manually on the button I see a message confirmation.
This is the HTML code from the button:

enter image description here

the Step definition file:

When("I click Save button",() =>{
    backofficeCreateDeleteClerkPage.saveBtn().click({froce:true})
})

and the js for the button

saveBtn() {
        return cy.get('im-page.hydrated').shadow().find('im-button.hydrated').contains('Save')
        
    }

Any help is appreciated.

Upvotes: 0

Views: 4834

Answers (3)

jjhelguero
jjhelguero

Reputation: 2571

You've got multiple shadows. You should be able to find it like this.

cy.find('im-button.hydrated')
  .shadow()
  .contains('Save')

Upvotes: 0

Alapan Das
Alapan Das

Reputation: 18650

You can directly use the button text Save and use contains for this:

cy.get('im-page.hydrated', {includeShadowDom: true})
  .find('im-button', {includeShadowDom: true})
  .eq(2)
  .find('button', {includeShadowDom: true})
  .click({force: true})

In case you dont want to add {includeShadowDom: true} in your code or repeat it, you can just write it once in your cypress.json and then by default commands like get, find etc will traverse shadow DOM's.

Upvotes: 1

Johan Nordlinder
Johan Nordlinder

Reputation: 1886

Is "force" misspelled here?

backofficeCreateDeleteClerkPage.saveBtn().click({froce:true})

Upvotes: 0

Related Questions