Auto-complete field handling in Selenium Java

Introduction

Auto-complete fields help users by suggesting options as they type. Testing them ensures the suggestions work correctly and the right option can be selected.

When testing a search box that shows suggestions while typing.

When verifying a form field that helps users pick from a list of options.

When checking that the correct suggestion is selected after typing.

When ensuring the auto-complete dropdown appears and disappears properly.

When validating that typing partial input filters the suggestions.

Syntax

Selenium Java

WebElement input = driver.findElement(By.id("inputFieldId"));
input.sendKeys("partial text");

// Wait for suggestions to appear
WebDriverWait wait = new WebDriverWait(driver, Duration.ofSeconds(10));
wait.until(ExpectedConditions.visibilityOfElementLocated(By.cssSelector(".suggestion-class")));

// Select suggestion
List<WebElement> suggestions = driver.findElements(By.cssSelector(".suggestion-class"));
for (WebElement suggestion : suggestions) {
    if (suggestion.getText().equals("Expected Option")) {
        suggestion.click();
        break;
    }
}

Use explicit waits to wait for suggestions to load before interacting.

Use unique and stable locators for the input and suggestion elements.

Examples

Types 'New' and selects the first suggestion from the list.

Selenium Java

input.sendKeys("New");
wait.until(ExpectedConditions.visibilityOfElementLocated(By.cssSelector(".autocomplete-item")));
List<WebElement> items = driver.findElements(By.cssSelector(".autocomplete-item"));
items.get(0).click();

Types 'San' and selects the suggestion containing 'San Francisco'.

Selenium Java

input.sendKeys("San");
wait.until(ExpectedConditions.visibilityOfElementLocated(By.cssSelector(".suggestion")));
for (WebElement item : driver.findElements(By.cssSelector(".suggestion"))) {
    if (item.getText().contains("San Francisco")) {
        item.click();
        break;
    }
}

Sample Program

This test opens a page with an auto-complete field, types 'Lon', waits for suggestions, selects 'London', and verifies the selection.

Selenium Java

import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.support.ui.ExpectedConditions;
import org.openqa.selenium.support.ui.WebDriverWait;
import java.time.Duration;
import java.util.List;

public class AutoCompleteTest {
    public static void main(String[] args) {
        System.setProperty("webdriver.chrome.driver", "path/to/chromedriver");
        WebDriver driver = new ChromeDriver();
        try {
            driver.get("https://example.com/autocomplete");
            WebElement input = driver.findElement(By.id("city-input"));
            input.sendKeys("Lon");

            WebDriverWait wait = new WebDriverWait(driver, Duration.ofSeconds(10));
            wait.until(ExpectedConditions.visibilityOfElementLocated(By.cssSelector(".autocomplete-suggestion")));

            List<WebElement> suggestions = driver.findElements(By.cssSelector(".autocomplete-suggestion"));
            boolean found = false;
            for (WebElement suggestion : suggestions) {
                if (suggestion.getText().equals("London")) {
                    suggestion.click();
                    found = true;
                    break;
                }
            }

            if (found && input.getAttribute("value").equals("London")) {
                System.out.println("Test Passed: 'London' selected successfully.");
            } else {
                System.out.println("Test Failed: 'London' not selected.");
            }
        } finally {
            driver.quit();
        }
    }
}

Important Notes

Always use explicit waits to avoid flaky tests when waiting for suggestions.

Check that the input field's value updates after clicking a suggestion.

Use meaningful locators that are less likely to change with UI updates.

Summary

Auto-complete fields suggest options as users type.

Use explicit waits to handle dynamic suggestion lists.

Select the correct suggestion by matching text and verify the input value.