如何使用 JavaScript 在日歷中單擊 Selenium 的年份

Question

我正在嘗試使用 JavaScript 編寫 Selenium 測試，但無法填充日歷數據。 它使用下拉菜單：

const {Builder, By, Key} = require('selenium-webdriver')


const test2 = async () => {

let driver = await new Builder().forBrowser('chrome').build()
await driver.manage().window().maximize()
await driver.get('https://demoqa.com/automation-practice-form')
let calendar = 
driver.findElement(By.xpath("//input[@id='dateOfBirthInput']"))
await calendar.click()
let month = driver.findElement(By.xpath("//select[@class='react- 
datepicker__month-select']"))
await month.click()
await month.sendKeys(Key.DOWN, Key.DOWN, Key.RETURN)

let year = driver.findElement(By.xpath("//select[contains(@class,'react-datepicker__year-select')]")).value = "1988"

我怎樣才能點擊我需要的價值？ 控制台記錄年份給我 1988，但我不知道如何在瀏覽器中輸入 select。 除了按Key.DOWN 35次之外還有別的方法嗎？ 我無法在 JavaScript 中使用 Select class。

Answer 1

您可以使用選項標簽直接在下拉列表中設置值，而無需打開它。 此外，如果在下拉列表中找不到您的選項，則會拋出錯誤。 您可以在 try 塊中處理它

month = "May"
year = "1988"
let driver = await new Builder().forBrowser('chrome').build()
await driver.manage().window().maximize()
await driver.get('https://demoqa.com/automation-practice-form')
let calendar = driver.findElement(By.xpath("//input[@id='dateOfBirthInput']"))
await calendar.click()
let month = driver.findElement(By.xpath("//select[@class='react-datepicker__month-select']/option[text()='"+month+"']"))
await month.click()

let year = driver.findElement(By.xpath("//select[contains(@class,'react-datepicker__year-select')]/option[text()='"+year+"']"))
await year.click()

Answer 2

沒有JavaScript環境。 但是執行 javascript 就可以了。

使用 Python 客戶端：

element = WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.CSS_SELECTOR, "input#dateOfBirthInput")))
driver.execute_script("arguments[0].value = arguments[1]", element, "24 Jan 2023")

瀏覽器快照：

---

在控制台中執行

命令

document.getElementById('dateOfBirthInput').value='24 Jan 2023'

快照：