How to send date within an input date control with onkeydown="return false" using Selenium Python

Question

I have this minimal html:

<!DOCTYPE html>
<html>
    <body>
        <input type="date" max="2023-03-09" value="2023-03-09" onkeydown="return false">
    </body>
</html>

That just asks for a date, but onkeydown="return false" prevents keyboard input. So I have to navigate the (I guess browser-generated) calendar, but don't know how to access it. Even the calendar icon in the control is difficult to access. I have resorted to clicking with a fixed offset, but maybe there's a better way.

My minimal python code is:

from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver import ActionChains
import time


driver = webdriver.Firefox()
driver.get("E:\\Web\\TestDate\\public_html\\index.html")
buttonDate = driver.find_element(By.TAG_NAME, "input")
action = ActionChains(driver)
w, h = buttonDate.size['width'], buttonDate.size['height']
x, y = buttonDate.location['x'], buttonDate.location['y']
wx, wy = driver.get_window_size()['width'], driver.get_window_size()['height']
action.move_to_element_with_offset(buttonDate, w - 10, h - 7)
action.click()
action.perform()
time.sleep(30)
driver.quit()

With that I can get the calendar control open, but cannot use send_keys() to change the date.

Edit: Thanks for all the answers, you all saved me. I have accepted the shortest, most general purpose one, even if all were good.

score 1 · Answer 1 · answered Jun 29 '23 at 12:38

just remove the event handler

driver.execute_script("document.querySelector('input[type=\"date\"]').onkeydown = () => {}")

Javascript code

document.querySelector('input[type="date"]').onkeydown = () => {}

full code such as

from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver import ActionChains
import time


driver = webdriver.Firefox()
driver.get("E:\\Web\\TestDate\\public_html\\index.html")
buttonDate = driver.find_element(By.TAG_NAME, "input")

# Call Javascript Here.
driver.execute_script("document.querySelector('input[type=\"date\"]').onkeydown = () => {}")

# Now send the keys here to the element
buttonDate.send_keys("20230629")

action = ActionChains(driver)

time.sleep(30)
driver.quit()

Online Test via jsfiddle

score 1 · Accepted Answer · answered Jun 29 '23 at 12:49

You can use Selenium's execute_script method to run JavaScript and pass the text into the desired textbox. Refer the code below:

date= "2023-03-09"
input_box = driver.find_element(By.XPATH, "//input[@type='date']")
driver.execute_script('arguments[0].value=arguments[1]', input_box, date)

Note: This is like inserting the text into the web page from backend. This solution won't imitate the human actions as selenium's send_keys does.

undetected Selenium · Answer 3 · 2023-06-29T14:49:25.273

Given the HTML:

<!DOCTYPE html>
<html>
    <body>
        <input type="date" max="2023-03-09" value="2023-03-09" onkeydown="return false">
    </body>
</html>

To send a customized date you can use the removeAttribute() method to remove the onkeydown attribute and invoke send_keys() as follows:

driver.get("file:///C:/Users/fname.lname/Desktop/My%20Documents/Selenium/date.html")
driver.execute_script("arguments[0].removeAttribute('onkeydown')", WebDriverWait(driver, 20).until(EC.visibility_of_element_located((By.CSS_SELECTOR, "input[type='date']"))))
driver.find_element(By.CSS_SELECTOR, "input[type='date']").send_keys("29062023")

Browser snapshot:

29062023

References

You can find a couple of relevant detailed discussions in:

score 1 · Answer 4 · answered Jun 29 '23 at 13:32

1

You can use the JS setAttribute() function to change the date directly:

script = (
    """document.querySelector('%s').setAttribute('%s','%s');"""
    % ('input[type="date"]', "value", "2023-06-29")
)
driver.execute_script(script)

answered Jun 29 '23 at 13:32

Michael Mintz

9,007
6
31
48

How to send date within an input date control with onkeydown="return false" using Selenium Python

4 Answers4

References