So wählen Sie ein Datum aus DatePicker/Kalender aus Selenium Webtreiber

Wie man mit dem Kalender umgeht Selenium

Für die DateTime-Auswahl verfügt HTML5 über ein neues Steuerelement, das unten gezeigt wird.

Behandeln Sie den Kalender in Selenium

Die obige Seite kann hier aufgerufen werden: http://demo.guru99.com/test/

Wenn wir uns das DOM des DateTime-Picker-Steuerelements ansehen, gibt es nur ein Eingabefeld für Datum und Uhrzeit.

Behandeln Sie den Kalender in Selenium


Um diese Art der Steuerung zu handhaben, füllen wir zunächst das Datum ohne Trennzeichen aus. Wenn das Datum also 09 ist, übergeben wir 25 an das Eingabefeld. Sobald dies erledigt ist, verschieben wir den Fokus vom Datum auf die Uhrzeit, indem wir die Tabulatortaste drücken und die Uhrzeit ausfüllen.

Wenn wir „02:45 Uhr“ eintragen müssen, übergeben wir „0245PM“ an dasselbe Eingabefeld.

Der Code für Datepicker sieht so aus:

import java.util.List;

import java.util.concurrent.TimeUnit;

import org.openqa.selenium.By;

import org.openqa.selenium.Keys;

import org.openqa.selenium.WebDriver;

import org.openqa.selenium.WebElement;

import org.openqa.selenium.chrome.ChromeDriver;

import org.testng.annotations.Test;

public class DateTimePicker {

    @Test

    public void dateTimePicker(){

        System.setProperty("webdriver.chrome.driver", "chromedriver.exe");

        WebDriver driver = new ChromeDriver();

        driver.manage().timeouts().implicitlyWait(10, TimeUnit.SECONDS);

        driver.get("http://demo.guru99.com/test/");

        //Find the date time picker control

        WebElement dateBox = driver.findElement(By.xpath("//form//input[@name='bdaytime']"));

        //Fill date as mm/dd/yyyy as 09/25/2013

        dateBox.sendKeys("09252013");

        //Press tab to shift focus to time field

        dateBox.sendKeys(Keys.TAB);

        //Fill time as 02:45 PM

        dateBox.sendKeys("0245PM");

    }

    }


Die Ausgabe wird wie folgt aussehen:

Behandeln Sie den Kalender in Selenium

Schauen wir uns ein weiteres Kalenderbeispiel an. Wir werden das Telerik DateTimePicker-Steuerelement verwenden. Kann zugegriffen werden HIER

Behandeln Sie den Kalender in Selenium

Wenn wir hier den Monat ändern müssen, müssen wir auf die Mitte der Kalenderüberschrift klicken.

Behandeln Sie den Kalender in Selenium

Wenn wir das Jahr ändern müssen, können wir dies auch tun, indem wir in der Datumsauswahl auf die Links „Weiter“ oder „Zurück“ klicken.

Behandeln Sie den Kalender in Selenium

Und schließlich können wir zum Ändern der Zeit die richtige Zeit aus dem Dropdown-Menü auswählen (Hinweis: Hier wird die Zeit in einem Abstand von 30 Minuten ausgewählt, z. B. 12:00, 12:30, 1:00, 1:30 usw.).

Behandeln Sie den Kalender in Selenium

Ein vollständiges Beispiel sieht so aus:

import java.util.Calendar;

import java.util.List;

import java.util.concurrent.TimeUnit;

import org.openqa.selenium.By;

import org.openqa.selenium.WebDriver;

import org.openqa.selenium.WebElement;

import org.openqa.selenium.firefox.FirefoxDriver;

import org.testng.annotations.Test;

public class DatePicker {

    @Test

    public void testDAtePicker() throws Exception{

        //DAte and Time to be set in textbox

        String dateTime ="12/07/2014 2:00 PM";

        WebDriver driver = new FirefoxDriver();

        driver.manage().window().maximize();
        
        driver.get("https://demos.telerik.com/kendo-ui/datetimepicker/index");
        
        driver.manage().timeouts().implicitlyWait(10, TimeUnit.SECONDS);
        
        //button to open calendar

        WebElement selectDate = driver.findElement(By.xpath("//span[@aria-controls='datetimepicker_dateview']"));
        
    selectDate.click();

    //button to move next in calendar

    WebElement nextLink = driver.findElement(By.xpath("//div[@id='datetimepicker_dateview']//div[@class='k-header']//a[contains(@class,'k-nav-next')]"));

    //button to click in center of calendar header

    WebElement midLink = driver.findElement(By.xpath("//div[@id='datetimepicker_dateview']//div[@class='k-header']//a[contains(@class,'k-nav-fast')]"));

    //button to move previous month in calendar

    WebElement previousLink = driver.findElement(By.xpath("//div[@id='datetimepicker_dateview']//div[@class='k-header']//a[contains(@class,'k-nav-prev')]")); 

        //Split the date time to get only the date part

        String date_dd_MM_yyyy[] = (dateTime.split(" ")[0]).split("/");

        //get the year difference between current year and year to set in calander

        int yearDiff = Integer.parseInt(date_dd_MM_yyyy[2])- Calendar.getInstance().get(Calendar.YEAR);

        midLink.click();

        if(yearDiff!=0){

            //if you have to move next year

            if(yearDiff>0){

                for(int i=0;i< yearDiff;i++){

                    System.out.println("Year Diff->"+i);

                    nextLink.click();

                }

            }

            //if you have to move previous year

            else if(yearDiff<0){

                for(int i=0;i< (yearDiff*(-1));i++){

                    System.out.println("Year Diff->"+i);

                    previousLink.click();

                }

            }

        }
        
        Thread.sleep(1000);

        //Get all months from calendar to select correct one

        List<WebElement> list_AllMonthToBook = driver.findElements(By.xpath("//div[@id='datetimepicker_dateview']//table//tbody//td[not(contains(@class,'k-other-month'))]"));
        
        list_AllMonthToBook.get(Integer.parseInt(date_dd_MM_yyyy[1])-1).click();
        
        Thread.sleep(1000);

        //get all dates from calendar to select correct one

        List<WebElement> list_AllDateToBook = driver.findElements(By.xpath("//div[@id='datetimepicker_dateview']//table//tbody//td[not(contains(@class,'k-other-month'))]"));
        
        list_AllDateToBook.get(Integer.parseInt(date_dd_MM_yyyy[0])-1).click();
        
        ///FOR TIME

        WebElement selectTime = driver.findElement(By.xpath("//span[@aria-controls='datetimepicker_timeview']"));

        //click time picker button

        selectTime.click();

        //get list of times

        List<WebElement> allTime = driver.findElements(By.xpath("//div[@data-role='popup'][contains(@style,'display: block')]//ul//li[@role='option']"));
      
        dateTime = dateTime.split(" ")[1]+" "+dateTime.split(" ")[2];

     //select correct time

        for (WebElement webElement : allTime) {

            if(webElement.getText().equalsIgnoreCase(dateTime))

            {

                webElement.click();

            }

        }

    }

}

Die Ausgabe wird wie folgt aussehen

Behandeln Sie den Kalender in Selenium