• Selenium Video Tutorials

Selenium WebDriver - 日期時間選擇器

上一頁
下一頁

Selenium Webdriver 可用於從日曆中選擇日期和時間。Web UI 上可以以多種方式設計日曆中的日期時間選擇器。根據 UI，需要設計測試用例。

什麼是日期時間選擇器？

日期時間選擇器基本上是在被測應用程式中建立日曆的使用者介面。日期時間選擇器的功能是從一個範圍內選擇特定的日期和/或時間。

如何檢查日期時間選擇器？

要識別下圖中顯示的日曆，首先我們會點選“選擇日期”欄位下的第一個輸入框，然後右鍵點選網頁，最後點選 Chrome 瀏覽器中的“檢查”按鈕。要調查頁面上的日曆，請點選 HTML 程式碼頂部可用的左上箭頭，如下所示。

Selenium Date Time Picker 1

過去日期選擇

讓我們以下面頁面中的日期時間選擇器為例，它具有選擇年份、月份、日期、小時、分鐘等選項。它還包含選擇過去或未來日期和時間的選項。讓我們選擇一個過去的日期和時間 - 上午 2023 年 6 月 4 日 09:05，然後驗證它們。

Selenium Date Time Picker 2

示例

package org.example;

import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.support.ui.Select;
import java.util.concurrent.TimeUnit;

public class DatTimePickers {
   public static void main(String[] args) throws InterruptedException {
   
      // Initiate the Webdriver
      WebDriver driver = new ChromeDriver();
      
      // adding implicit wait of 20 secs
      driver.manage().timeouts().implicitlyWait(20, TimeUnit.SECONDS);
      
      // URL launch for accessing calendar
      driver.get("https://tutorialspoint.tw/selenium/practice/date-picker.php");
      
      // identify element to get calendar
      WebElement f = driver
         .findElement(By.xpath("//*[@id='datetimepicker2']"));
      f.click();
      
      // selecting month June
      WebElement month = driver
         .findElement(By.xpath("/html/body/div[3]/div[1]/div/div/select"));
      Select select = new Select(month);
      select.selectByVisibleText("June");
      
      // getting selected month
      String selectedMonth = select.getFirstSelectedOption().getText();
      
      // selecting year 2023
      WebElement year = driver.findElement(By.xpath("/html/body/div[3]/div[1]/div/div/div/input"));
      
      // removing existing year then entering
      year.clear();
      year.sendKeys("2023");
      
      // selecting day 4
      WebElement day = driver.findElement(By.xpath("//span[contains(@aria-label,'"+selectedMonth+" 4')]"));
      day.click();
      
      // selecting AM time
      WebElement time = driver.findElement(By.xpath("/html/body/div[3]/div[3]/span[2]"));
      if (time.getText().equalsIgnoreCase("PM")){
         time.click();
      }
      
      // selecting hour
      WebElement hour = driver
         .findElement(By.xpath("/html/body/div[3]/div[3]/div[1]/input"));
      
      // removing existing hour then entering
      hour.clear();
      hour.sendKeys("9");
      
      // selecting minutes
      WebElement minutes = driver.findElement(By.xpath("/html/body/div[3]/div[3]/div[2]/input"));
      
      // removing existing minutes then entering
      minutes.clear();
      minutes.sendKeys("5");
      
      // reflecting both date and time
      f.click();
      
      // get date and time selected
      String v = f.getAttribute("value");
      System.out.println("Date and time selected by Date Time Picker: " + v);
      
      // check date and time selected
      if (v.equalsIgnoreCase("2023-06-04 09:05")){
         System.out.print("Date and Time selected successfully");
      } else {
         System.out.print("Date and Time selected unsuccessfully");
      }
      // close browser
      driver.quit();
   }
}

輸出

Date and time selected by Date Time Picker: 2023-06-04 09:05
Date and Time selected successfully

Process finished with exit code 0

在上面的示例中，我們使用日期時間選擇器從日曆中選擇了過去的日期和時間，然後透過訊息驗證是否選擇了正確的日期 - **日期時間選擇器選擇的日期和時間：2023-06-04 09:05** 和 **日期和時間選擇成功**。

最後，收到訊息 **程序已完成，退出程式碼為 0**，表示程式碼成功執行。

未來日期選擇

讓我們再舉一個下面頁面中日期時間選擇器的例子，我們將選擇一個未來的日期和時間 - 晚上 2025 年 6 月 4 日 21:05，然後驗證它們。

Selenium Date Time Picker 3

示例

package org.example;

import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.support.ui.Select;
import java.util.concurrent.TimeUnit;

public class DatTimePickersForward {
   public static void main(String[] args) throws InterruptedException {
   
      // Initiate the Webdriver
      WebDriver driver = new ChromeDriver();
      
      // adding implicit wait of 20 secs
      driver.manage().timeouts().implicitlyWait(20, TimeUnit.SECONDS);

      // URL launch for accessing calendar
      driver.get("https://tutorialspoint.tw/selenium/practice/date-picker.php");
      
      // identify element to get calendar
      WebElement f = driver.findElement(By.xpath("//*[@id='datetimepicker2']"));
      f.click();
      
      // selecting month June
      WebElement month = driver.findElement(By.xpath("/html/body/div[3]/div[1]/div/div/select"));
      Select select = new Select(month);
      select.selectByVisibleText("June");
      
      // getting selected month
      String selectedMonth = select.getFirstSelectedOption().getText();

      // selecting year 2023
      WebElement year = driver.findElement(By.xpath("/html/body/div[3]/div[1]/div/div/div/input"));
      
      // removing existing year then entering
      year.clear();
      year.sendKeys("2025");
      
      // selecting day 4
      WebElement day = driver.findElement(By.xpath
         ("//span[contains(@aria-label,'"+selectedMonth+" 4')]"));
      day.click();
      
      // selecting PM time
      WebElement time = driver.findElement(By.xpath("/html/body/div[3]/div[3]/span[2]"));
      if (time.getText().equalsIgnoreCase("AM")){
         time.click();
      }
      
      // selecting hour
      WebElement hour = driver.findElement(By.xpath("/html/body/div[3]/div[3]/div[1]/input"));
      
      // removing existing hour then entering
      hour.clear();
      hour.sendKeys("9");
      
      // selecting minutes
      WebElement minutes = driver.findElement(By.xpath("/html/body/div[3]/div[3]/div[2]/input"));
      
      // removing existing minutes then entering
      minutes.clear();
      minutes.sendKeys("5");
      
      // reflecting both date and time
      f.click();
      
      // get date and time selected
      String v = f.getAttribute("value");
      System.out.println("Date and time selected by Date Time Picker: " + v);

      // check date and time selected
      if (v.equalsIgnoreCase("2025-06-04 21:05")){
         System.out.print("Date and Time selected successfully");
      } else {
         System.out.print("Date and Time selected unsuccessfully");
      }
      
      // close browser
      driver.quit();
   }
}

輸出

Date and time selected by Date Time Picker: 2025-06-04 21:05
Date and Time selected successfully

Process finished with exit code 0

在上面的示例中，我們使用日期時間選擇器從日曆中選擇了未來的日期和時間，然後透過訊息驗證是否選擇了正確的日期 - **日期時間選擇器選擇的日期和時間：2025-06-04 21:05** 和 **日期和時間選擇成功**。

最後，收到訊息 **程序已完成，退出程式碼為 0**，表示程式碼成功執行。

當前日期選擇

讓我們再舉一個下面頁面中日期時間選擇器的例子，我們將選擇一個當前日期的日期和時間，然後驗證它們。請注意，在此日期時間選擇器中，預設情況下會選擇當前日期，我們只需要選擇當前時間即可。

Selenium Date Time Picker 4

示例

package org.example;

import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;
import java.time.LocalDateTime;
import java.time.format.DateTimeFormatter;
import java.util.concurrent.TimeUnit;

public class DateTimePickersCurrent {
   public static void main(String[] args) throws InterruptedException {
   
      // Initiate the Webdriver
      WebDriver driver = new ChromeDriver();
      
      // adding implicit wait of 20 secs
      driver.manage().timeouts().implicitlyWait(20, TimeUnit.SECONDS);
      
      // URL launch for accessing calendar
      driver.get("https://tutorialspoint.tw/selenium/practice/date-picker.php");
      
      // get current time
      LocalDateTime l = LocalDateTime.now();
      DateTimeFormatter formatter = 
         DateTimeFormatter.ofPattern("yyyy-MM-dd HH:mm");
      String dateTime = l.format(formatter);
      String[] dtTime = dateTime.split(" ");
      String time = dtTime[1];
      String[] t = time.split(":");
      String hour = t[0];
      String minute = t[1];
      
      // identify element to get calendar
      WebElement f = driver.findElement(By.xpath("//*[@id='datetimepicker2']"));
      f.click();
      
      // selecting hour based on current
      WebElement hours = driver.findElement(By.xpath("/html/body/div[3]/div[3]/div[1]/input"));
      
      // removing existing hour then entering
      hours.clear();
      hours.sendKeys(hour);
      
      // selecting minutes based on current minutes
      WebElement minutes = driver.findElement(By.xpath("/html/body/div[3]/div[3]/div[2]/input"));
      
      // removing existing minutes then entering
      minutes.clear();
      minutes.sendKeys(minute);
      
      // reflecting both date and time
      f.click();

      // get date and time selected
      String v = f.getAttribute("value");
      System.out.println("Date and time selected by Date Time Picker: " + v);
      
      // check date and time selected
      if (v.equalsIgnoreCase(dateTime)){
         System.out.print("Date and Time selected successfully");
      } else {
         System.out.print("Date and Time selected unsuccessfully");
      }

      // close browser
      driver.quit();
   }
}

輸出

Date and time selected by Date Time Picker: 2024-03-13 13:29
Date and Time selected successfully

Process finished with exit code 0

在上面的示例中，我們使用日期時間選擇器從日曆中選擇了當前日期和時間，然後透過訊息驗證是否選擇了正確的日期 - **日期時間選擇器選擇的日期和時間：2024-03-13 13:29** 和 **日期和時間選擇成功**。

最後，收到訊息 **程序已完成，退出程式碼為 0**，表示程式碼成功執行。

結論

這總結了我們關於 Selenium Webdriver 日期時間選擇器教程的全面內容。我們首先描述了什麼是日期時間選擇器，如何檢查它以及一些示例來逐步演示如何使用 Selenium 選擇過去、當前和將來的日期和時間。這使您深入瞭解 Selenium 中的日期時間選擇器。明智的做法是不斷練習您學到的知識，並探索與 Selenium 相關的其他知識，以加深您的理解並擴充套件您的視野。

列印頁面
上一頁
下一頁
廣告