Understanding Dropdown Types

Before practicing, it's important to identify the type of dropdown you're working with.

1. Standard HTML Dropdown

Uses the HTML <select> tag.

Example:

Advertisement
 
<select>
    <option>India</option>
    <option>USA</option>
</select>
 

Handled using Selenium's Select class.


2. Bootstrap / Custom Dropdown

Usually built with:

  • div
  • span
  • ul
  • li

There is no <select> tag.

Handled using:

  • click()
  • XPath
  • CSS Selectors

3. Dynamic Dropdown

Options load only after:

  • typing
  • API response
  • another dropdown selection

Usually requires explicit waits.


4. Multi-Select Dropdown

Allows selecting multiple values simultaneously.

Handled using the Select class (if it's a standard multi-select) or click actions (if it's custom).


1. Standard <select> Dropdowns (Basic Level)

These exercises are designed for beginners and focus on Selenium's Select class.


Exercise 1

Select a country using visible text.

Example:

 
India
 

Verify:

  • Correct option is selected.
  • UI updates correctly.

Exercise 2

Select the same country using the value attribute.

Example:

 
<option value="IN">India</option>
 

Exercise 3

Select a country using the index.

Practice:

  • Index 0
  • Middle index
  • Last index

Observe how indexes change if options are reordered.


Exercise 4

Print every option in the dropdown.

Validate:

  • Total options
  • Text
  • Order

Exercise 5

Count the total number of options.

Compare with business requirements.


Exercise 6

Verify the default selected option.

Many forms load with:

 
Select Country
 

or

 
Please Choose
 

Validate the default selection.


Exercise 7

Read the currently selected option.

Print it to the console.


Exercise 8

Change selection multiple times.

Example:

 
India

↓

USA

↓

Canada
 

Verify each update.


Exercise 9

Verify the dropdown is enabled.

Attempt selection only if enabled.


Exercise 10

Verify the dropdown is displayed.


Practice Goals

After these exercises you should comfortably:

  • Select by text
  • Select by value
  • Select by index
  • Read selected value
  • Count options
  • Validate defaults

2. Date Dropdown Practice

Many enterprise applications still use dropdowns for date selection.

Examples:

  • Date of Birth
  • Passport Expiry
  • Insurance Start Date
  • Joining Date

Exercise 1

Select:

  • Day
  • Month
  • Year

Verify all three selections.


Exercise 2

Select today's date dynamically.

Avoid hardcoded values.


Exercise 3

Automate Date of Birth selection.

Example:

 
15

August

1998
 

Exercise 4

Validate the displayed date.

Ensure:

  • Day matches
  • Month matches
  • Year matches

Exercise 5

Attempt an invalid date.

Example:

 
31 February
 

Observe application behavior.


Exercise 6

Reset the dropdown.

Return all values to defaults.


Exercise 7

Select the first option.


Exercise 8

Select the last option.

Useful for boundary testing.


Exercise 9

Use index logic instead of hardcoding values.

Example:

 
Current Month + 1
 

Date Testing Best Practices

Practice validating:

  • Leap years
  • Month boundaries
  • Minimum dates
  • Maximum dates
  • Invalid combinations

3. Dynamic Dropdown Handling (Intermediate)

Dynamic dropdowns populate values only after:

  • API calls
  • User typing
  • Previous selections

These require synchronization.


Exercise 1

Wait until options are populated.

Avoid:

 
Thread.sleep()
 

Use explicit waits.


Exercise 2

Select a dynamically loaded value.

Example:

 
Hyderabad
 

appears only after selecting

 
India
 

Exercise 3

Select using partial text.

Example:

 
Hyd
 

 
Hyderabad
 

Exercise 4

Ignore case sensitivity.

Example:

 
india

↓

India
 

Exercise 5

Handle option text changes.

Example:

Old:

 
USA
 

New:

 
United States
 

Update the automation accordingly.


Exercise 6

Read values from test data.

Examples:

  • Excel
  • JSON
  • Properties
  • CSV

Select based on external data.


Exercise 7

Handle environment-specific values.

Example:

QA:

 
Customer A
 

Production:

 
Customer B
 

Avoid hardcoding.


Exercise 8

Select a random option.

Useful for exploratory automation.

Exclude:

 
Select Country
 

Exercise 9

Avoid hardcoded selections.

Instead:

Read values dynamically.


Exercise 10

Verify dropdown sorting.

Examples:

Alphabetical

 
Australia

Canada

India

USA
 

Ensure order is correct.


Dynamic Dropdown Real-World Scenarios

Practice these workflows:

  • Country → State
  • Department → Employee
  • Category → Product
  • Brand → Model
  • City search suggestions
  • Auto-complete search boxes

Common Mistakes to Avoid

Avoid these practices:

❌ Hardcoding indexes

❌ Using Thread.sleep()

❌ Assuming option order never changes

❌ Ignoring loading delays

❌ Not validating selected values

Multi-Select Dropdowns

Unlike standard dropdowns, multi-select dropdowns allow users to choose more than one option simultaneously.

Common examples include:

  • Skills
  • Hobbies
  • Programming Languages
  • User Roles
  • Product Categories
  • Email Recipients
  • Permissions

Before automating, always verify whether the dropdown supports multiple selection.


Exercise 1

Select multiple options.

Example:

 
Java

Python

Selenium
 

Verify all three remain selected.


Exercise 2

Deselect a single option.

Example:

Initially selected:

 
Java

Python

Selenium
 

Remove:

 
Python
 

Validate:

  • Java remains selected.
  • Selenium remains selected.

Exercise 3

Deselect all options.

Verify:

  • No option remains selected.
  • Application behaves correctly.

Exercise 4

Retrieve every selected option.

Print:

 
Java

Python

Selenium
 

Exercise 5

Verify the dropdown supports multiple selection.

Practice checking:

 
isMultiple()
 

Observe the result.


Exercise 6

Select options using a loop.

Example:

 
Option 1

Option 2

Option 3
 

Automate repeated selection.


Exercise 7

Select values using an array.

Example:

 
["Java","Python","SQL"]
 

Read values dynamically.


Exercise 8

Select values using a List.

Useful in framework design.


Exercise 9

Validate the total selected count.

Expected:

 
3 Selected
 

Exercise 10

Remove one selected value.

Verify:

  • Remaining selections stay intact.
  • Count updates correctly.

Real-Time Multi-Select Scenarios

Practice these business workflows.


Skills Selection

Employee profile:

✓ Java

✓ Selenium

✓ SQL

Save profile.

Refresh.

Verify selections persist.


Email Recipients

Select multiple users.

Validate:

  • Every recipient receives the email.
  • UI displays selected users correctly.

Permission Assignment

Administrator selects:

  • Read
  • Write
  • Delete

Verify:

  • Correct permissions are stored.
  • Unauthorized options remain unavailable.

Common Multi-Select Mistakes

Avoid:

❌ Assuming every dropdown supports multiple selection.

❌ Selecting duplicate values.

❌ Hardcoding indexes.

❌ Ignoring deselection validation.


5. Bootstrap / Non-Select Dropdowns (Advanced)

Modern applications rarely use HTML <select>.

Instead, they build custom dropdowns using:

  • div
  • span
  • ul
  • li

Because there is no <select> element, Selenium's Select class cannot be used.

Automation is performed using:


Exercise 1

Open a Bootstrap dropdown.

Click the dropdown.

Verify:

  • Options appear.
  • Dropdown expands.

Exercise 2

Select an option.

Validate:

  • Dropdown closes.
  • Selected value appears.

Exercise 3

Handle a dropdown built using:

 
<ul>

<li>

</li>
</ul>
 

Locate:

  • Parent list
  • Individual items

Click the desired value.


Exercise 4

Handle a dropdown without any <select> tag.

Inspect HTML.

Determine:

  • Parent container
  • Option locator

Exercise 5

Handle dynamic IDs.

Example:

Today:

 
dropdown_12345
 

Tomorrow:

 
dropdown_67891
 

Build stable locators.


Exercise 6

Handle searchable dropdowns.

Example:

Type:

 
Hyd
 

Select:

 
Hyderabad
 

Exercise 7

Handle scrollable dropdowns.

Scroll until the desired option becomes visible.

Then select it.


Exercise 8

Select an option that is initially hidden.

Example:

Scroll to:

 
Zimbabwe
 

Validate successful selection.


Exercise 9

Validate the selected value displayed in the UI.

Ensure:

Displayed value

=

Selected value


Exercise 10

Select values using partial text matching.

Useful when:

  • Spaces differ
  • Prefixes change
  • Suffixes change

Searchable Dropdown Practice

Modern applications frequently use searchable dropdown libraries such as:

  • Select2
  • React Select
  • Angular Material
  • PrimeNG
  • Material UI

Practice:

Type

Wait

Select

Validate


Exercise 1

Type a search keyword.

Wait for suggestions.

Select the matching option.


Exercise 2

Handle delayed API responses.

Wait until options load.


Exercise 3

Select using keyboard.

Practice:

  • Arrow Down
  • Enter

Exercise 4

Search with lowercase.

Validate uppercase results.


Exercise 5

Search using partial words.

Example:

 
Ban
 

 
Bangalore
 

Scrollable Dropdown Exercises

Large enterprise applications may contain thousands of values.

Practice:

  • Scroll to middle values.
  • Scroll to last values.
  • Select dynamically loaded values.

Enterprise Dropdown Scenarios


Country → State → City

Select:

Country

State loads

Select State

City loads

Select City

Validate every step.


Department → Employee

Department:

 
QA
 

Employee dropdown refreshes.

Select:

 
Naveed
 

Category → Product

Category:

Electronics

Products appear.

Select:

Laptop

Validate the update.


Payment Method

Select:

Credit Card

Additional fields appear.

Validate:

  • Card Number
  • CVV
  • Expiry Date

Shipping Method

Choose:

Express

Delivery estimate changes.

Verify updated information.


Common Bootstrap Dropdown Problems


Problem 1

Dropdown opens.

Immediately closes.

Practice:

  • Better locators
  • Stable timing
  • Retry strategy

Problem 2

Dropdown never opens.

Possible reasons:

Investigate.


Problem 3

Wrong option selected.

Improve locator strategy.

Avoid index-based selection.


Problem 4

Dropdown rendered outside DOM hierarchy.

Common in:

React portals

Material UI

PrimeNG

Locate the popup container separately.


Problem 5

Dropdown values change after every deployment.

Avoid exact text matching.

Use stable business identifiers.


Framework-Level Exercises

These are excellent exercises for automation engineers with 3–5+ years of experience.


Exercise 1

Create a reusable method:

Select by:

  • Text
  • Value
  • Index

Exercise 2

Create another reusable method for Bootstrap dropdowns.

Accept:

  • Locator
  • Option text

Exercise 3

Detect dropdown type automatically.

If:

<select>

Use Select class

Else

Use click-based logic.


Exercise 4

Add logging.

Example:

 
Selecting Country

India selected successfully
 

Exercise 5

Capture a screenshot whenever dropdown selection fails.

Useful for debugging CI failures.


Exercise 6

Handle dropdown selection in parallel execution.

Ensure thread-safe implementation.

Real Application Scenarios

Enterprise applications rarely have a single dropdown. Most workflows involve multiple dropdowns that depend on each other, load data dynamically, or trigger changes elsewhere in the application.


Scenario 1 – Country → State → City

One of the most common interview scenarios.

Workflow:

 
Country
      ↓
State loads dynamically
      ↓
City loads dynamically
 

Practice

  1. Select a country.
  2. Wait for the state dropdown to populate.
  3. Select a state.
  4. Wait for the city dropdown.
  5. Select a city.
  6. Validate all selected values.

Expected Result:

  • Every dropdown updates correctly.
  • No stale data remains after parent selection changes.

Scenario 2 – Department → Employee

Example:

 
Department

↓

QA

↓

Employees

↓

Naveed
 

Validate

  • Employee list refreshes after department selection.
  • Previous employee values disappear.
  • Correct employee is selected.

Scenario 3 – Dropdown Populated Through an API

Modern applications often populate dropdown values from backend services.

Practice:

  • Open the page.
  • Wait until API data loads.
  • Select a value.
  • Validate successful selection.

Scenario 4 – Loading Delay

Dropdown takes several seconds to load.

Practice:

  • Wait properly.
  • Avoid Thread.sleep().
  • Select only after values appear.

Scenario 5 – Retry Selection

Selection occasionally fails due to timing.

Implement:

  • Retry logic
  • Proper waits
  • Validation after selection

Scenario 6 – Dropdown Inside an iframe

Workflow:

  1. Switch to iframe.
  2. Open dropdown.
  3. Select value.
  4. Validate.
  5. Switch back to the default content.

Scenario 7 – Dropdown Inside a Modal Dialog

Practice:

  • Open modal.
  • Wait for animation.
  • Handle dropdown.
  • Close modal.

Scenario 8 – After Page Refresh

Select a value.

Refresh the page.

Verify:

  • Default value restored

or

  • Previous value retained

depending on business requirements.


Scenario 9 – Dropdown After Login

Many enterprise applications display role-specific dropdown values.

Example:

Admin:

 
All Departments
 

User:

 
Assigned Department Only
 

Validate correct options based on user role.


Scenario 10 – Checkout Flow

Example:

Shipping Method

Payment Method

Delivery Slot

Order Summary

Validate every dropdown selection updates the checkout correctly.


7. Defect & Edge-Case Exercises

These exercises simulate production issues encountered by automation engineers.


Exercise 1 – Dropdown Does Not Open

Possible causes:

  • Overlay
  • JavaScript error
  • Element not clickable
  • Wrong locator

Debug the issue.


Exercise 2 – Wrong Value Selected

Expected:

 
India
 

Actual:

 
Indonesia
 

Validate the selected value rather than assuming success.


Exercise 3 – Selection Lost After Reload

Workflow:

  • Select a value.
  • Refresh.
  • Validate persistence.

Exercise 4 – Disabled Dropdown

Attempt selection.

Verify:

  • Selection is blocked.
  • Appropriate state is displayed.

Exercise 5 – Duplicate Values

Example:

 
India

India
 

Select the correct option using additional attributes or surrounding context.


Exercise 6 – Dropdown Changes on Hover

Some applications reveal options only after hovering.

Practice:

  • Hover
  • Open dropdown
  • Select option

Exercise 7 – Dropdown Disappears During Selection

Possible causes:

  • Animation
  • Auto-close
  • Re-render

Implement a stable retry strategy.


Exercise 8 – Auto-Closing Dropdown

Dropdown closes immediately after opening.

Practice:

  • Reopen if necessary.
  • Select efficiently.
  • Validate final state.

Exercise 9 – Firefox-Only Failure

Works in Chrome.

Fails in Firefox.

Investigate:

  • Browser rendering
  • Timing
  • Driver differences
  • JavaScript execution

Exercise 10 – Headless Mode Failure

Selection works in headed mode.

Fails in headless mode.

Practice debugging:

  • Viewport size
  • Hidden elements
  • Timing issues
  • Scroll behavior

8. Interview-Level Must-Do Tasks

These are common Selenium interview questions for automation engineers.


Task 1

Write a reusable utility method to select by:

  • Visible text
  • Value
  • Index

Task 2

Handle both:

  • Standard <select>
  • Bootstrap dropdown

using a common framework.


Task 3

Design a reusable dropdown utility class.

Include:

  • Logging
  • Error handling
  • Validation
  • Reusable methods

Task 4

Select values based on environment.

Example:

QA:

 
India
 

Production:

 
USA
 

Read values from configuration.


Task 5

Validate dropdown values against an API response.

Ensure:

  • UI values
  • Backend values

match exactly.


Task 6

Read dropdown selections from Excel.

Use Apache POI.


Task 7

Run dropdown tests in parallel.

Ensure:

  • Independent browser sessions
  • Stable execution

Task 8

Optimize dropdown performance.

Reduce:

  • Duplicate locators
  • Unnecessary waits
  • Repeated searches

Task 9

Implement logging.

Example:

 
Country selected successfully

State selected successfully

City selected successfully
 

Task 10

Capture a screenshot whenever dropdown selection fails.

Attach it to reports for debugging.


9. Demo Website Mapping

The following websites provide excellent practice for different dropdown types.


DemoQA – Select Menu

Best for:

  • Standard dropdowns
  • Multi-select dropdowns
  • Select by text/value/index
  • Validation exercises

Practice:

  • Default selection
  • Option count
  • Multi-select behavior

Selenium Easy – Basic Select Dropdown

Ideal for:

  • Country selection
  • Date dropdowns
  • Multi-select examples

Practice:

  • Select class
  • Deselect methods
  • Selected values

ToolsQA Automation Practice Form

Best for:

  • Date of Birth dropdowns
  • Complete form automation

Practice:

  • Day
  • Month
  • Year
  • Validation

jQuery AZ Bootstrap Demo

Excellent for:

  • Bootstrap dropdowns
  • Dynamic dropdowns

Practice:

  • Click-based selection
  • Custom HTML structures

Select2.org

Perfect for:

  • Searchable dropdowns
  • Auto-complete

Practice:

  • Typing
  • Waiting
  • Selecting
  • Validation

DemoQA Modal Dialogs

Useful for:

  • Dropdowns inside popups
  • Waiting strategies

Best for:

Country

State

City

dependent dropdown exercises.


End-to-End Capstone Project

Complete Practice Form Automation

Website:

DemoQA Automation Practice Form


Objective

Automate an entire registration workflow using every dropdown technique learned in this cluster.


Workflow

Launch browser.

Open DemoQA Practice Form.

Select:

  • Date of Birth
    • Day
    • Month
    • Year

Select Country using a standard dropdown.

Select multiple hobbies.

Handle Bootstrap State dropdown.

Handle Bootstrap City dropdown.

Submit the form.

Validate the confirmation dialog.


Skills Covered

This single project includes:

  • Standard dropdowns
  • Date dropdowns
  • Multi-select
  • Bootstrap dropdowns
  • Dynamic dropdowns
  • Validation
  • Wait strategies
  • End-to-end form automation

This closely resembles real enterprise automation projects.


Best Practices

When working with dropdowns in Selenium:

  • Identify the dropdown type before choosing an automation strategy.
  • Use the Select class only for genuine HTML <select> elements.
  • Prefer selecting by visible text over indexes whenever practical.
  • Use explicit waits for dynamic or API-driven dropdowns.
  • Validate the selected value after every selection.
  • Build reusable utility methods for common dropdown operations.
  • Read configurable values from external sources such as properties files, JSON, or Excel instead of hardcoding them.
  • Capture logs and screenshots when selection fails to simplify debugging.
  • Keep dropdown interactions thread-safe when running tests in parallel.

Common Interview Questions

1. What are the three ways to select an option in a standard dropdown?

  • By visible text
  • By value
  • By index

2. How do Bootstrap dropdowns differ from standard dropdowns?

Bootstrap dropdowns do not use the <select> tag. They are usually built with elements such as <div>, <ul>, and <li>, so Selenium's Select class cannot be used. Instead, you locate and click the elements directly.


3. How do you handle dependent dropdowns?

Select the parent value, wait for the child dropdown to populate, and then select the required child option.


4. How do you automate searchable dropdowns?

Type the search text, wait for the matching options to appear, select the required option, and verify the selected value.


5. How do you validate dropdown values?

Read the selected option from the UI and compare it with the expected value or backend/API response.