Как да изберете дата от DatePicker/Calendar в Selenium Уебдрайвер

Как да работите с календара в Selenium

За избор на DateTime HTML5 има нов контрол, показан по-долу.

Манипулирайте календара в Selenium

Горната страница може да бъде достъпна тук: https://demo.guru99.com/test/

Ако видим DOM на контролата за избор на DateTime, ще има само едно поле за въвеждане както за дата, така и за час.

Манипулирайте календара в Selenium


Така че, за да се справим с този тип контрол, първо ще попълним дата, без да я разделяме с разделител, т.е. ако датата е 09 г., тогава ще предадем 25 в полето за въвеждане. След като приключим, ще преместим фокуса от дата към час, като натиснем „tab“ и попълним времето.

Ако трябва да попълним 02:45 PM, ще го предадем като '0245PM' в същото поле за въвеждане.

Кодът за избор на дата изглежда така –

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("https://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");

    }

    }


Резултатът ще бъде като-

Манипулирайте календара в Selenium

Нека да разгледаме друг пример за Календар. Ще използваме контрола Telerik DateTimePicker. Може да бъде достъпен тук

Манипулирайте календара в Selenium

Тук, ако трябва да променим месеца, трябва да щракнем върху средата на заглавката на календара.

Манипулирайте календара в Selenium

По същия начин, ако трябва да променим годината, можем да го направим, като щракнете върху следващите или предишните връзки в инструмента за избор на дата.

Манипулирайте календара в Selenium

И накрая за промяна на часа можем да изберем правилния час от падащото меню (Забележка: Тук времето е избрано с интервал от 30 минути, т.е. 12:00, 12:30, 1:00, 1:30 и т.н.).

Манипулирайте календара в Selenium

Пълен пример изглежда така-

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();

            }

        }

    }

}

Изходът ще бъде като

Манипулирайте календара в Selenium