如何从 Selenium 中的 datepicker 中选择日期 - Javascript

在使用 Selenium 进行网页自动化测试时，经常需要对日期选择器进行操作。本文将介绍如何使用 Javascript 在 Selenium 中选择 datepicker 中的日期。

1. 准备工作

首先，需要安装 selenium-webdriver 模块。可以使用以下命令安装它：

npm install selenium-webdriver

然后，需要导入 selenium-webdriver 和 chromedriver，并创建一个 WebDriver 实例：

const { Builder } = require('selenium-webdriver');
const chrome = require('selenium-webdriver/chrome');

const options = new chrome.Options();
options.addArguments('--disable-dev-shm-usage');

const driver = new Builder()
  .forBrowser('chrome')
  .setChromeOptions(options)
  .build();

2. 选择日期

假设日期选择器的 HTML 代码如下：

<input type="text" class="datepicker">

首先，需要使用 findElement 方法找到该元素：

const datepicker = await driver.findElement(By.className('datepicker'));

然后，可以使用 sendKeys 方法将日期键入文本框。注意，需要先将文本框清空：

await datepicker.clear();
await datepicker.sendKeys('2022-05-23');

如果要选择今天的日期，可以使用以下代码：

const today = new Date();
const todayString = `${today.getFullYear()}-${today.getMonth() + 1}-${today.getDate()}`;

await datepicker.clear();
await datepicker.sendKeys(todayString);

3. 完整代码

下面是一个完整的例子，它演示了如何在 Selenium 中选择 datepicker 中的日期：

const { Builder, By } = require('selenium-webdriver');
const chrome = require('selenium-webdriver/chrome');

const options = new chrome.Options();
options.addArguments('--disable-dev-shm-usage');

async function example() {
  const driver = new Builder()
    .forBrowser('chrome')
    .setChromeOptions(options)
    .build();

  try {
    await driver.get('https://www.example.com');

    const datepicker = await driver.findElement(By.className('datepicker'));

    const today = new Date();
    const todayString = `${today.getFullYear()}-${today.getMonth() + 1}-${today.getDate()}`;

    await datepicker.clear();
    await datepicker.sendKeys(todayString);
  } finally {
    await driver.quit();
  }
}

example();

参考文献

• Selenium 文档
• Stack Overflow 回答