Date picker interaction in Selenium Python - Practice Problems & Coding Challenges

Challenge - 5 Problems

❓ Predict Output

intermediate

What is the output of this Selenium code snippet?

Consider the following Selenium Python code that tries to select a date from a date picker widget. What will be the printed output after execution?

Selenium Python

from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC

# Assume driver is already initialized and navigated to the page
try:
    date_input = driver.find_element(By.ID, 'datePicker')
    date_input.click()
    # Wait for the calendar popup
    calendar = WebDriverWait(driver, 5).until(
        EC.visibility_of_element_located((By.CLASS_NAME, 'calendar-popup'))
    )
    # Select the 15th day
    day_15 = calendar.find_element(By.XPATH, ".//td[text()='15']")
    day_15.click()
    print('Date selected successfully')
except Exception as e:
    print(f'Error: {e}')

A Date selected successfully

B Error: no such element: Unable to locate element: {"method":"id","selector":"datePicker"}

C Error: TimeoutException

D Error: ElementNotInteractableException

💡 Hint

Think about what happens if the date picker and calendar popup exist and are interactable.

If the date picker input with ID 'datePicker' exists and clicking it shows a calendar popup with class 'calendar-popup', then the code finds the day '15' and clicks it successfully, printing 'Date selected successfully'. If any element is missing or not interactable, an exception would be caught and printed instead.

❓ locator

intermediate

Which locator is best to select the 'Next Month' button in a date picker?

You want to automate clicking the 'Next Month' button in a date picker widget. The button has the HTML: . Which locator is the best practice to use in Selenium?

A By.CLASS_NAME, 'nav-next'

B By.CSS_SELECTOR, "button[aria-label='Next Month']"

C By.XPATH, "//button[text()='>']"

D By.ID, 'next-month-btn'

💡 Hint

Use attributes that are stable and descriptive for accessibility.

Using the aria-label attribute is best practice for accessibility and stability. The class name might be reused elsewhere, the text '>' is not reliable, and the ID does not exist.

❓ assertion

advanced

Which assertion correctly verifies the selected date in a date picker input?

After selecting a date, the input field with ID 'datePicker' should show '2024-06-15'. Which assertion in Python unittest is correct?

Selenium Python

selected_date = driver.find_element(By.ID, 'datePicker').get_attribute('value')

A self.assertFalse(selected_date != '2024-06-15')

B self.assertTrue(selected_date == '15-06-2024')

C self.assertIn('2024-06-15', selected_date)

D self.assertEqual(selected_date, '2024-06-15')

💡 Hint

Check exact value equality for input fields.

The input's value attribute should exactly match '2024-06-15'. Option D uses assertEqual with the correct format. Option D uses wrong date format. Option D allows partial match which is less strict. Option D is logically correct but less clear.

🔧 Debug

advanced

Why does this Selenium code fail to select a date?

Given this code snippet, why does it raise ElementNotInteractableException? code: date_input = driver.find_element(By.ID, 'datePicker') date_input.send_keys('2024-06-15')

A The date picker input is read-only and requires clicking the calendar to select a date.

B The locator By.ID, 'datePicker' is incorrect and finds no element.

C send_keys is not supported on input elements.

D The date format '2024-06-15' is invalid for the input.

💡 Hint

Consider how date pickers often restrict direct typing.

Many date pickers have inputs that are read-only or disabled for typing. They require user interaction with the calendar widget. Trying to send keys causes ElementNotInteractableException.

❓ framework

expert

Which test framework feature best supports waiting for dynamic date picker elements?

You are automating tests for a web app with a dynamic date picker that loads calendar days asynchronously. Which Selenium WebDriver feature best handles waiting for the calendar days to appear before selecting a date?

A Implicit Wait set globally on the WebDriver instance

B Thread.sleep() to pause fixed time before interacting

C Explicit Wait with Expected Conditions targeting visibility of calendar day elements

D Using try-except blocks to catch NoSuchElementException and retry

💡 Hint

Use waits that wait for specific conditions rather than fixed delays.

Explicit waits with expected conditions allow waiting for specific elements or states, making tests reliable and efficient. Implicit waits apply globally and may cause unpredictable delays. Thread.sleep() is inefficient and brittle. Try-except retry is manual and error-prone.

Practice

1. What is the primary purpose of interacting with a date picker in Selenium tests?

easy

A. To test if the date picker changes color when clicked

B. To check if the date picker is visible on the page only

C. To select a date and verify it appears correctly in the input field

D. To verify the page title changes after selecting a date

Solution

1. Step 1: Understand date picker role

   Date pickers let users pick a date easily and show it in an input field.

2. Step 2: Verify date selection in tests

   Tests should select a date and check if the input field shows the chosen date correctly.

3. Final Answer:

   To select a date and verify it appears correctly in the input field -> Option C

4. Quick Check:

   Date picker test = select and verify date [OK]

Hint: Pick date, then check input value matches [OK]

Common Mistakes:

• Only checking visibility without selecting date
• Ignoring input field verification
• Testing unrelated UI changes like color
• Assuming page title changes after date pick

2. Which Selenium Python code snippet correctly clicks a date picker input and selects a date with locator by ID 'dateInput'?

easy

A. driver.find_element(By.ID, 'dateInput').send_keys('15')

B. driver.find_element(By.CLASS_NAME, 'dateInput').click()
driver.find_element(By.ID, '15').click()

C. driver.find_element(By.CSS_SELECTOR, '#dateInput').select('15')

D. driver.find_element(By.ID, 'dateInput').click()
driver.find_element(By.XPATH, "//td[text()='15']").click()

Solution

1. Step 1: Click date picker input by ID

   Use By.ID with 'dateInput' to click the input field correctly.

2. Step 2: Select date by visible text

   Use XPath to find the table cell with text '15' and click it to select the date.

3. Final Answer:

   driver.find_element(By.ID, 'dateInput').click()\ndriver.find_element(By.XPATH, "//td[text()='15']").click() -> Option D

4. Quick Check:

   Correct locators and click actions = driver.find_element(By.ID, 'dateInput').click() driver.find_element(By.XPATH, "//td[text()='15']").click() [OK]

Hint: Use By.ID for input, XPath for date cell text [OK]

Common Mistakes:

• Using CLASS_NAME instead of ID for input
• Trying to send_keys directly to date cell
• Using non-existent select() method
• Wrong locator for date cell

3. What will be the output of this Selenium Python code snippet if the date picker input initially is empty and user selects date '10'?

driver.find_element(By.ID, 'dateInput').click()
driver.find_element(By.XPATH, "//td[text()='10']").click()
selected_date = driver.find_element(By.ID, 'dateInput').get_attribute('value')
print(selected_date)

medium

A. 2024-10-10

B. 10

C. Empty string

D. None

Solution

1. Step 1: Click input and select date '10'

   The code clicks the input and selects the date cell with text '10'.

2. Step 2: Get input value attribute

   After selection, the input's value attribute usually holds the full date string, e.g., '2024-10-10'.

3. Final Answer:

   2024-10-10 -> Option A

4. Quick Check:

   Input value after date pick = full date string [OK]

Hint: Date pickers set full date string in input value [OK]

Common Mistakes:

• Expecting only day number as input value
• Assuming input remains empty
• Confusing None with empty string
• Not retrieving 'value' attribute

4. Given this Selenium Python code snippet, what is the main error preventing date selection?

date_input = driver.find_element(By.ID, 'dateInput')
date_input.click()
driver.find_element(By.XPATH, "//td[text()='25']").send_keys(Keys.ENTER)

medium

A. Using send_keys(Keys.ENTER) on a non-input element

B. Missing import for Keys

C. Wrong locator for date input

D. Not waiting for date picker to open

Solution

1. Step 1: Identify element receiving send_keys

   The code sends ENTER key to a table cell (td), which is not an input field.

2. Step 2: Understand send_keys usage

   send_keys works on input or editable elements, not on static table cells; clicking is needed instead.

3. Final Answer:

   Using send_keys(Keys.ENTER) on a non-input element -> Option A

4. Quick Check:

   send_keys on non-input element causes failure [OK]

Hint: Click date cell, don't send_keys to it [OK]

Common Mistakes:

• Trying to send_keys to non-input elements
• Forgetting to import Keys
• Assuming locator is wrong without checking
• Ignoring wait for picker visibility

5. You want to write a Selenium Python test that selects the date '1' of next month in a date picker. The date picker shows current month by default and has a 'Next' button with ID 'nextMonthBtn'. Which sequence correctly selects the date?

hard

A. driver.find_element(By.XPATH, "//td[text()='1']").click()
driver.find_element(By.ID, 'nextMonthBtn').click()

B. driver.find_element(By.ID, 'nextMonthBtn').click()
driver.find_element(By.XPATH, "//td[text()='1']").click()

C. driver.find_element(By.ID, 'dateInput').send_keys('1')

D. driver.find_element(By.ID, 'nextMonthBtn').send_keys(Keys.ENTER)
driver.find_element(By.XPATH, "//td[text()='1']").click()

Solution

1. Step 1: Click 'Next' button to go to next month

   Click the button with ID 'nextMonthBtn' to change the calendar to next month.

2. Step 2: Click date '1' in the updated calendar

   After calendar updates, click the table cell with text '1' to select the date.

3. Final Answer:

   driver.find_element(By.ID, 'nextMonthBtn').click()\ndriver.find_element(By.XPATH, "//td[text()='1']").click() -> Option B

4. Quick Check:

   Navigate then select date = driver.find_element(By.ID, 'nextMonthBtn').click() driver.find_element(By.XPATH, "//td[text()='1']").click() [OK]

Hint: Click next month first, then pick date [OK]

Common Mistakes:

• Selecting date before navigating to next month
• Using send_keys instead of click on buttons
• Ignoring calendar update after clicking next
• Wrong order of actions