Skip to content
CodeKruPro

Select and deselect in a multi-select list

Automation taskMediumAsked in: Accenture, Capgemini, Infosys, SaaS Labs, TCS, Wipro

"How do you handle a list where users can pick several values?" Check that the list allows several choices, select two, deselect one, and read what remains selected.

Handle Multi-Select Dropdown

Handle Multi-Select Dropdown

Multi-select dropdowns allow selecting multiple options. Use isMultiple() to check, and getAllSelectedOptions() to get all selections.

The multiSelect dropdown has: Selenium, Playwright, Cypress, TestCafe, WebDriverIO.

HTML Structure:

<select id="multiSelect" multiple>
  <option value="selenium">Selenium</option>
  <option value="playwright">Playwright</option>
  <option value="cypress">Cypress</option>
  <option value="testcafe">TestCafe</option>
  <option value="webdriverio">WebDriverIO</option>
</select>

Task:

  1. Navigate to https://testkru.com/Elements/Dropdowns
  2. Verify the multiSelect dropdown supports multiple selections
  3. Select "Selenium" and "Cypress"
  4. Print all selected options
  5. Deselect "Cypress"
  6. Print remaining selected options

Expected output:

Is multiple: true
Selected: Selenium, Cypress
After deselect: Selenium