Jak wybrać datę z DatePicker/Kalendarz w Selenium Sterownik internetowy
Jak obsługiwać kalendarz w Selenium
W przypadku wyboru daty i godziny HTML5 ma nową kontrolkę pokazaną poniżej.
Dostęp do powyższej strony można uzyskać tutaj: https://demo.guru99.com/test/
Jeśli przyjrzymy się DOM kontrolki DateTime Picker, zobaczymy, że znajduje się tam tylko jedno pole wprowadzania daty i godziny.
Aby obsłużyć ten typ kontroli, najpierw wypełnimy datę bez rozdzielania jej ogranicznikiem, tj. jeśli data to 09/25/2013, to przekażemy 09252013 do pola wprowadzania. Po wykonaniu tej czynności przeniesiemy fokus z daty na czas, naciskając 'tab' i wypełniając czas.
Jeżeli musimy wpisać godzinę 02:45 PM, przekażemy ją jako „0245PM” do tego samego pola wprowadzania danych.
Kod datepicker wygląda następująco –
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"); } }
Dane wyjściowe będą takie jak-
Spójrzmy na inny przykład Kalendarza. Będziemy używać kontrolki Telerik DateTimePicker. Można uzyskać dostęp tutaj
Tutaj, jeśli chcemy zmienić miesiąc, musimy kliknąć środek nagłówka kalendarza.
Podobnie, jeśli zajdzie potrzeba zmiany roku, możemy to zrobić, klikając następny lub poprzedni link w narzędziu datepicker.
I wreszcie, aby zmienić czas, możemy wybrać właściwy czas z listy rozwijanej (Uwaga: tutaj czas jest wybierany w odstępie 30 minut, tj. 12:00, 12:30, 1:00, 1:30 itd.).
Kompletny przykład wygląda tak:
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(); } } } }
Dane wyjściowe będą podobne