Pour la sélection DateTime, HTML5 a un nouveau contrôle illustré ci-dessous.
La page ci-dessus est accessible ici
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 en premier, nous allons remplir la date sans séparer par un délimiteur, c'est-à-dire si la date est le 25/09/2013, alors nous passerons 09252013 à la zone de saisie. Une fois cela fait, nous déplacerons le focus de la date à l'heure en appuyant sur `` tabulation '' et remplir le temps.
Si nous devons remplir 14h45, nous passerons un '0245PM' à la même zone de saisie.
Le code pour 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;classe publique DateTimePicker {@Testpublic void dateTimePicker () {System.setProperty ("webdriver.chrome.driver", "chromedriver.exe");Pilote WebDriver = nouveau ChromeDriver ();driver.manage (). timeouts (). implicitlyWait (10, TimeUnit.SECONDS);driver.get ("http://demo.guru99.com/test/");// Recherche le contrôle du sélecteur de date et d'heureWebElement dateBox = driver.findElement (By.xpath ("// form // input [@ name = 'bdaytime']"));// Remplissez la date au format mm / jj / aaaa au 25/09/2013dateBox.sendKeys ("09252013");// Appuyez sur la tabulation pour déplacer le focus sur le champ de tempsdateBox.sendKeys (Keys.TAB);// Temps de remplissage à 14h45dateBox.sendKeys ("0245PM");}}
La sortie sera comme-
Regardons un autre exemple de calendrier. Nous utiliserons le contrôle Telerik DateTimePicker. Accessible 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 changer 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 {@Testpublic void testDAtePicker () lève une exception {// Dte et heure à définir dans la zone de texteString dateTime = "07/12/2014 14h00";Pilote WebDriver = nouveau FirefoxDriver ();driver.manage (). window (). maximiser ();driver.get ("https://demos.telerik.com/kendo-ui/datetimepicker/index");driver.manage (). timeouts (). implicitlyWait (10, TimeUnit.SECONDS);// bouton pour ouvrir le calendrierWebElement selectDate = driver.findElement (By.xpath ("// span [@ aria-controls = 'datetimepicker_dateview']"));selectDate.click ();// bouton pour passer au suivant dans le calendrierWebElement nextLink = driver.findElement (By.xpath ("// div [@ id = 'datetimepicker_dateview'] // div [@ class = 'k-header'] // a [contient (@ class, 'k-nav- suivant')]"));// bouton pour cliquer au centre de l'en-tête du calendrierWebElement midLink = driver.findElement (By.xpath ("// div [@ id = 'datetimepicker_dateview'] // div [@ class = 'k-header'] // a [contient (@ class, 'k-nav- vite')]"));// bouton pour déplacer le mois précédent dans le calendrierWebElement previousLink = driver.findElement (By.xpath ("// div [@ id = 'datetimepicker_dateview'] // div [@ class = 'k-header'] // a [contient (@ class, 'k-nav- prev ')] "));// Fractionner la date et l'heure pour obtenir uniquement la partie de la dateString date_dd_MM_yyyy [] = (dateTime.split ("") [0]). Split ("/");// obtenir la différence d'année entre l'année en cours et l'année à définir dans calendrierint yearDiff = Integer.parseInt (date_dd_MM_yyyy [2]) - Calendar.getInstance (). get (Calendar.YEAR);midLink.click ();if (yearDiff! = 0) {// si vous devez déménager l'année prochaineif (yearDiff> 0) {pour (int i = 0; i " + i);nextLink.click ();}}// si vous devez déménager l'année précédenteelse if (yearDiff <0) {pour (int i = 0; i <(yearDiff * (- 1)); i ++) {System.out.println ("Année Diff ->" + i);previousLink.click ();}}}Thread.sleep (1000);// Récupère tous les mois du calendrier pour en sélectionner le bonList 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);// récupère toutes les dates du calendrier pour en sélectionner uneList 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 ();/// POUR LE TEMPSWebElement selectTime = driver.findElement (By.xpath ("// span [@ aria-controls = 'datetimepicker_timeview']"));// cliquez sur le bouton de sélection de l'heureselectTime.click ();// obtenir la liste des heuresList allTime = driver.findElements (By.xpath ("// div [@ data-role = 'popup'] [contient (@ style, 'display: block')] // ul // li [@role = 'option'] "));dateTime = dateTime.split ("") [1] + "" + dateTime.split ("") [2];// sélectionner l'heure correctefor (WebElement webElement: allTime) {if (webElement.getText (). equalsIgnoreCase (dateHeure)){webElement.click ();}}}}
La sortie sera comme