CODEWITHSUNDEEP
cypress
soccerway
soccerway

Reputation: 11991

Using Cypress drop down select values are not happening

How can I select the dropdown values using Cypress, it is build on angular page. By default the select field is displaying as below. First option click on the drop down but not value, I have tried eq(1), eq(2)..but not working yet.

enter image description here

I have tried the below options in cypress but these are not working;

Option : 1

cy.get('.mat-select-value > span').eq(0).then((option)=>{
  cy.wrap(option).eq(0).click();
})

Option 2:

cy.get('.mat-select-value > span').contains("Phase 4 - Boond ").click();

// Attached the html:

enter image description here

Upvotes: 4

Views: 8312

Answers (2)

Mark Denes
Mark Denes

Reputation: 211

Sometimes the click() doesn't work as you would expect, in this case you can also try the trigger('click') for the option selection.

like:

cy.get('your-selector').trigger('click')

Upvotes: 4

Mr. J.
Mr. J.

Reputation: 3741

you might want to try this:

cy.get('.mat-select-value > span').eq(0).click() // to open the drop down
cy.get('.mat-option').contains('Phase 4 - Boond').click() // to click the actual option

Upvotes: 4

Related Questions