Comment sélectionner la date dans DatePicker/Calendar dans Selenium Pilote Web
Krishna Rungta
Comment gérer le calendrier dans Selenium
Pour la sélection DateTime, HTML5 dispose d'un nouveau contrôle illustré ci-dessous.
La page ci-dessus est accessible ici : http://demo.guru99.com/test/
Si nous voyons le DOM du contrôle DateTime Picker, il n'y aura qu'une seule zone de saisie pour la date et l'heure.
Donc, pour gérer ce type de contrôle, nous remplirons d'abord la date sans la séparer par un délimiteur, c'est-à-dire que si la date est le 09/25/2013, nous passerons alors 09252013 dans la zone de saisie. Une fois cela fait, nous déplacerons l'attention de date en heure en appuyant sur « tabulation » et en remplissant l'heure.
Si nous devons remplir 02:45 PM, nous lui transmettrons un « 0245PM » dans la même zone de saisie.
Le code de datepicker ressemble à ceci :
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");
}
}
La sortie sera comme-
Regardons un autre exemple de calendrier. Nous utiliserons le contrôle Telerik DateTimePicker. Peut être consulté ici
Ici, si nous devons changer le mois, nous devons cliquer au milieu de l'en-tête du calendrier.
De même, si nous devons changer l'année, nous pouvons le faire en cliquant sur les liens suivant ou précédent sur le sélecteur de date.
Et enfin, pour modifier l'heure, nous pouvons sélectionner l'heure correcte dans la liste déroulante (Remarque : ici, l'heure est sélectionnée dans un intervalle de 30 minutes, c'est-à-dire 12h00, 12h30, 1h00, 1h30, etc.).
Un exemple complet ressemble à-
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();
}
}
}
}
La sortie sera comme
