Cypress: Items selection


Dropdowns

Simple dropdown

In case of a simple dropdown, where you can only select one item at a time, a dropdown with a HTML code like this:

<select name="someDropdownName" onchange="someMethod" id="someDropdownID" class="someClass">
	<option selected="selected" value=""></option>
	<option value="someItemValue">SomeItemText</option>
</select>

You can select an item by just using its text:

cy.get(‘#someDropdownId‘).select(‘someItemText‘);

Handling multiple results

Selecting the nth element

Assuming you have an element like this on your page:

<ul>
  <li>Item A</li>
  <li>Item B</li>
  <li>Item C</li>
</ul> 

The following command shows how we can select an element among multiple results using an index:

cy.get(‘ul>li’).eq(1).contains(‘Item B’)