كيفية تحديد التاريخ من DatePicker/Calendar في Selenium Webdriver

كيفية التعامل مع التقويم في السيلينيوم

بالنسبة لتحديد التاريخ والوقت، يحتوي HTML5 على عنصر تحكم جديد موضح أدناه.

التعامل مع التقويم في السيلينيوم

يمكن الوصول إلى الصفحة أعلاه هنا: http://demo.guru99.com/test/

إذا رأينا DOM لعنصر تحكم DateTime Picker، فسيكون هناك إدخال واحد فقط box لكل من التاريخ والوقت.

التعامل مع التقويم في السيلينيوم


لذا للتعامل مع هذا النوع من التحكم أولاً، سنقوم بملء التاريخ دون فصله بمحدد، أي إذا كان التاريخ هو 09/25/2013، فسوف نقوم بتمرير 09252013 إلى الإدخال box. بمجرد الانتهاء من ذلك، سنقوم بتحويل التركيز من تاريخ لآخر عن طريق الضغط على "علامة التبويب" وملء الوقت.

إذا أردنا ملء 02:45 مساءً، فسنمررها "0245PM" إلى نفس الإدخال box.

يبدو رمز منتقي التاريخ كما يلي -

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

    }

    }


سيكون الإخراج مثل-

التعامل مع التقويم في السيلينيوم

دعونا نلقي نظرة على مثال تقويم آخر. سوف نستخدم التحكم Telerik DateTimePicker. يمكن الوصول إليها هنا

التعامل مع التقويم في السيلينيوم

هنا، إذا أردنا تغيير الشهر، علينا النقر على منتصف رأس التقويم.

التعامل مع التقويم في السيلينيوم

وبالمثل، إذا أردنا تغيير العام، فيمكننا القيام بذلك عن طريق النقر على الروابط التالية أو السابقة في منتقي التاريخ.

التعامل مع التقويم في السيلينيوم

وأخيرًا لتغيير الوقت يمكننا تحديد الوقت الصحيح من القائمة المنسدلة (ملاحظة: هنا يتم تحديد الوقت في فجوة قدرها 30 دقيقة، أي 12:00، 12:30، 1:00، 1:30 وما إلى ذلك).

التعامل مع التقويم في السيلينيوم

المثال الكامل يبدو مثل-

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

            }

        }

    }

}

سيكون الإخراج مثل

التعامل مع التقويم في السيلينيوم