DatePickerElement

Playwright element wrapper for Vaadin DatePicker component

DatePickerElement

Playwright element wrapper for <vaadin-date-picker>. Adds convenience methods for LocalDate values and lookup by label.

Component Tag

vaadin-date-picker

Implements

• HasInputFieldElement
• HasValidationPropertiesElement
• HasClearButtonElement
• HasPlaceholderElement
• HasThemeElement
• FocusableElement
• HasAriaLabelElement
• HasEnabledElement
• HasTooltipElement
• HasLabelElement
• HasHelperElement

Factory Methods

getByLabel (Page)

public static DatePickerElement getByLabel(Page page, String label)

Get the DatePickerElement by its label. Uses ARIA role COMBOBOX.

page · Page · required

The Playwright page

label · String · required

The accessible label of the field

Returns: The matching DatePickerElement

getByLabel (Locator)

public static DatePickerElement getByLabel(Locator locator, String label)

Get the DatePickerElement by its label within a given scope.

locator · Locator · required

The locator to search within

label · String · required

The accessible label of the field

Returns: The matching DatePickerElement

Constructor

DatePickerElement

public DatePickerElement(Locator locator)

Create a new DatePickerElement.

locator · Locator · required

The locator for the <vaadin-date-picker> element

Methods

setValue (LocalDate)

public void setValue(LocalDate date)

Set the value using a LocalDate formatted as ISO-8601.

date · LocalDate · required

The date to set

setValue (String)

@Override
public void setValue(String value)

Set the value of the input.

value · String · required

Value formatted as in the view (dd/mm/yyyy)

getValueAsLocalDate

public LocalDate getValueAsLocalDate()

Get the current value as a LocalDate.

Returns: The parsed date or null when empty

assertValue (String)

@Override
public void assertValue(String value)

Assert that the input value equals the provided string.

value · String · required

Expected value formatted as in the view (dd/mm/yyyy)

assertValue (LocalDate)

public void assertValue(LocalDate value)

Assert that the value equals the provided date.

value · LocalDate

Expected LocalDate or null for empty

getAriaLabelLocator

@Override
public Locator getAriaLabelLocator()

Get the locator for ARIA label.

Returns: The input locator

getFocusLocator

@Override
public Locator getFocusLocator()

Get the locator to use for focus operations.

Returns: The input locator

getEnabledLocator

@Override
public Locator getEnabledLocator()

Get the locator to use for enabled/disabled checks.

Returns: The input locator

Usage Examples

Basic Date Selection

DatePickerElement datePicker = DatePickerElement.getByLabel(page, "Appointment date");
datePicker.assertVisible();
datePicker.assertHelperHasText("Enter the appointment date");

LocalDate testDate = LocalDate.of(2025, 9, 20);
datePicker.setValue(testDate);
datePicker.assertValue(testDate);

String Format

DateTimeFormatter formatter = DateTimeFormatter.ofPattern("dd/MM/yyyy");
LocalDate testDate = LocalDate.of(2025, 9, 20);

DatePickerElement datePicker = DatePickerElement.getByLabel(page, "Appointment date");
datePicker.setValue(testDate);
datePicker.assertValue(formatter.format(testDate));

Min/Max Validation

DatePickerElement datePicker = DatePickerElement.getByLabel(page, "Vacation date");
LocalDate today = LocalDate.now();
LocalDate initialDate = today.plusDays(7);
LocalDate maxDate = today.plusDays(30);

datePicker.assertValue(initialDate);

// Valid date within bounds
LocalDate validDate = today.plusDays(15);
datePicker.setValue(validDate);
datePicker.assertValue(validDate);
datePicker.assertValid();

// Invalid date (after max)
LocalDate invalidDate = maxDate.plusDays(1);
datePicker.setValue(invalidDate);
datePicker.assertInvalid();
datePicker.assertErrorMessage("Maximum number of days exceeded.");

// Invalid date (before min)
LocalDate anotherInvalidDate = today.minusDays(1);
datePicker.setValue(anotherInvalidDate);
datePicker.assertInvalid();
datePicker.assertErrorMessage("Minimum number of days exceeded.");

Theme

DatePickerElement datePicker = DatePickerElement.getByLabel(page, "Appointment date");
datePicker.assertVisible();
datePicker.assertTheme("small");

Focus

DatePickerElement datePicker = DatePickerElement.getByLabel(page, "Appointment date");
DatePickerElement secondPicker = DatePickerElement.getByLabel(page, "Vacation date");

datePicker.assertIsFocused();
secondPicker.assertIsNotFocused();
secondPicker.focus();
secondPicker.assertIsFocused();
datePicker.assertIsNotFocused();

ARIA Label

DatePickerElement datePicker = DatePickerElement.getByLabel(page, "Invisible label");
datePicker.assertVisible();
datePicker.assertAriaLabel("Invisible label");

Enabled/Disabled

DatePickerElement datePicker = DatePickerElement.getByLabel(page, "Enabled/Disabled Field");
datePicker.assertDisabled();

page.locator("#enable-disable-button").click();

datePicker.assertEnabled();

Tooltip

DatePickerElement datePicker = DatePickerElement.getByLabel(page, "Appointment date");
datePicker.assertVisible();
datePicker.assertTooltipHasText("Tooltip for datepicker");