Beginner 12 min 4 scenarios

Dropdown Automation Practice

Master dropdown interactions in Selenium & Playwright — select by visible text, select by value, retrieve all options, and handle multi-select elements.

Scenario 1: Select by Visible Text

Select “Apple” from the fruit dropdown using visible text.

Scenario 2: Select by Value Attribute

Select “India” using its value attribute, not visible text.

Scenario 3: Select Last Option & Get All Options

Select the last programming language, then retrieve all available options.

Scenario 4: Multi-Select (CTRL + Click)

Hold Ctrl and click to select multiple superheroes.

What You'll Learn

Selenium (Java)

  • Select.selectByVisibleText()
  • Select.selectByValue()
  • Select.getOptions()
  • Select.getAllSelectedOptions()
  • Select.deselectAll()
Tutorial video coming soon

Up Next

Data Table

Practice reading, sorting, and filtering table data

Test Cases

Introduction

HTML <select> dropdowns are handled differently across frameworks:

  • Selenium provides a dedicated Select helper class
  • Playwright uses selectOption() with flexible matchers
  • Both support single-select and multi-select dropdowns

Common scenarios:

  1. Select by visible text
  2. Select by index
  3. Select by value attribute
  4. Get all available options
  5. Get the currently selected option
  6. Multi-select

Key Methods Summary

Action Selenium (Java) Playwright (JS) Playwright (Python)
By visible text selectByVisibleText("text") selectOption({ label: "text" }) select_option(label="text")
By index selectByIndex(n) selectOption({ index: n }) select_option(index=n)
By value selectByValue("val") selectOption("val") select_option("val")
Get selected getFirstSelectedOption().getText() inputValue() input_value()
Get all options getOptions() locator("option").allTextContents() locator("option").all_text_contents()

1. Select by visible text

Selenium (Java)

Select select = new Select(driver.findElement(By.id("fruitSelect")));
select.selectByVisibleText("Apple");
assertEquals("Apple", select.getFirstSelectedOption().getText());

Playwright (JS)

await page.locator("#fruitSelect").selectOption({ label: "Apple" });
await expect(page.locator("#fruitSelect")).toHaveValue("apple");

Playwright (Python)

page.locator("#fruitSelect").select_option(label="Apple")
expect(page.locator("#fruitSelect")).to_have_value("apple")

2. Select by index

Selenium (Java)

Select select = new Select(driver.findElement(By.id("languageSelect")));
select.selectByIndex(2); // selects the 3rd option (0-based)
System.out.println(select.getFirstSelectedOption().getText());

Playwright (JS)

await page.locator("#languageSelect").selectOption({ index: 2 });
const value = await page.locator("#languageSelect").inputValue();
console.log(value);

Playwright (Python)

page.locator("#languageSelect").select_option(index=2)
value = page.locator("#languageSelect").input_value()
print(value)

3. Select by value attribute

Selenium (Java)

Select select = new Select(driver.findElement(By.id("countrySelect")));
select.selectByValue("india");
assertEquals("India", select.getFirstSelectedOption().getText());

Playwright (JS)

await page.locator("#countrySelect").selectOption("india");
await expect(page.locator("#countrySelect")).toHaveValue("india");

Playwright (Python)

page.locator("#countrySelect").select_option("india")
expect(page.locator("#countrySelect")).to_have_value("india")

4. Get all available options

Selenium (Java)

Select select = new Select(driver.findElement(By.id("languageSelect")));
List<WebElement> options = select.getOptions();
for (WebElement opt : options) {
    System.out.println(opt.getText());
}
System.out.println("Total options: " + options.size());

Playwright (JS)

const options = await page.locator("#languageSelect option").allTextContents();
console.log(options); // ["Python", "Java", "JavaScript"]

Playwright (Python)

options = page.locator("#languageSelect option").all_text_contents()
print(options)

5. Verify currently selected option

Selenium (Java)

Select select = new Select(driver.findElement(By.id("countrySelect")));
String selected = select.getFirstSelectedOption().getText();
assertEquals("Argentina", selected);

Playwright (JS)

await expect(page.locator("#countrySelect")).toHaveValue("argentina");

Playwright (Python)

expect(page.locator("#countrySelect")).to_have_value("argentina")

6. Multi-select dropdown

Selenium (Java)

Select multiSelect = new Select(driver.findElement(By.id("heroSelect")));
assertTrue(multiSelect.isMultiple());
 
multiSelect.selectByVisibleText("Batman");
multiSelect.selectByVisibleText("Aquaman");
 
List<WebElement> selected = multiSelect.getAllSelectedOptions();
assertEquals(2, selected.size());

Playwright (JS)

await page.locator("#heroSelect").selectOption([
  { label: "Batman" },
  { label: "Aquaman" }
]);
const selected = await page.locator("#heroSelect option:checked").count();
expect(selected).toBe(2);

Playwright (Python)

page.locator("#heroSelect").select_option([
    {"label": "Batman"},
    {"label": "Aquaman"}
])
selected_count = page.locator("#heroSelect option:checked").count()
assert selected_count == 2

📄 Also Read: Top 10 Best Automation Practice Website

Frequently Asked Questions