Les formulaires sont les éléments Web fondamentaux pour recevoir des informations des visiteurs du site Web. Les formulaires Web ont différents éléments d'interface graphique tels que les zones de texte, les champs de mot de passe, les cases à cocher, les boutons radio, les listes déroulantes, les entrées de fichier, etc.
Nous verrons comment accéder à ces différents éléments de formulaire en utilisant Selenium Web Driver avec Java. Selenium encapsule chaque élément de formulaire en tant qu'objet de WebElement. Il fournit une API pour trouver les éléments et agir sur eux, comme entrer du texte dans des zones de texte, cliquer sur les boutons, etc.
Dans ce tutoriel, nous verrons comment identifier les éléments de formulaire suivants
- Introduction à WebElement, findElement (), findElements ()
- Zone de saisie
- Saisie de valeurs dans les zones de saisie
- Suppression de valeurs dans les zones de saisie
- Boutons
- Soumettre des boutons
- Code complet
- Dépannage
Introduction à WebElement, findElement (), findElements ()
Selenium Web Driver encapsule un élément de formulaire simple en tant qu'objet de WebElement.
Il existe diverses techniques par lesquelles le WebDriver identifie les éléments du formulaire en fonction des différentes propriétés des éléments Web comme l'ID, le nom, la classe, XPath, la variable, les sélecteurs CSS, le texte de lien, etc.
Web Driver fournit les deux méthodes WebElement suivantes pour rechercher les éléments.
- findElement () - trouve un seul élément Web et retourne comme un objet WebElement Selenium.
- findElements () - renvoie une liste d'objets WebElement correspondant aux critères du localisateur.
Voyons les extraits de code pour obtenir un seul élément - Champ de texte dans une page Web en tant qu'objet de WebElement à l'aide de la méthode findElement (). Nous couvrirons la méthode findElements () pour trouver plusieurs éléments dans les tutoriels suivants.
Étape 1: Nous devons importer ce package pour créer des objets de Web Elements
Étape 2: Nous devons appeler la méthode findElement () disponible sur la classe WebDriver et obtenir un objet de WebElement.
Reportez-vous ci-dessous pour voir comment cela se fait.
Zone de saisie
Les zones de saisie font référence à l'un de ces deux types:
- Champs de texte - Zones de texte d'entrée Selenium qui acceptent les valeurs saisies et les affichent telles quelles.
- Champs de mot de passe - zones de texte qui acceptent les valeurs saisies mais les masquent comme une série de caractères spéciaux (généralement des points et des astérisques) pour éviter que des valeurs sensibles ne soient affichées.
Localisateurs
La méthode findElement () prend un paramètre qui est un localisateur de l'élément. Différents localisateurs comme By.id (), By.name (), By.xpath (), By.CSSSelector () etc. localisent les éléments de la page en utilisant leurs propriétés telles que `` '' id, nom ou chemin, etc.
Vous pouvez utiliser des plugins comme Fire path pour obtenir de l'aide pour obtenir l'id, xpath, etc. des éléments.
En utilisant l'exemple de site http://demo.guru99.com/test/login.html donné ci-dessous est le code pour localiser le champ de texte "Adresse e-mail" en utilisant le localisateur d'identifiant et le champ "Mot de passe" en utilisant le localisateur de nom.
- Le champ de texte de l'e-mail est localisé par ID
- Le champ du mot de passe est localisé par nom
sendkeys dans Selenium
sendkeys () dans Selenium est une méthode utilisée pour entrer du contenu modifiable dans les champs de texte et de mot de passe pendant l'exécution du test. Ces champs sont identifiés à l'aide de localisateurs tels que nom, classe, id, etc. C'est une méthode disponible sur l'élément Web. Contrairement à la méthode type, la méthode sendkeys () ne remplace le texte existant dans aucune zone de texte.
Saisie de valeurs dans les zones de saisie
Pour entrer du texte dans les champs de texte et les champs de mot de passe, sendKeys () est la méthode disponible sur le WebElement dans Selenium.
En utilisant le même exemple du site http://demo.guru99.com/test/login.html, voici comment trouver les champs Texte et Mot de passe et entrer du texte dans Selenium.
- Recherchez le champ de texte «Adresse e-mail» à l'aide du localisateur d'identifiants.
- Recherchez le champ "Mot de passe" à l'aide du localisateur de noms
- Entrez le texte dans "Adresse e-mail" en utilisant la méthode Selenium sendkeys.
- Entrez un mot de passe dans le champ "Mot de passe" en utilisant la méthode sendKeys ().
Suppression de valeurs dans les zones de saisie
La méthode clear () est utilisée pour supprimer le texte dans une zone de saisie. Cette méthode n'a pas besoin de paramètre . L'extrait de code ci-dessous effacera le texte des champs Email ou Mot de passe
Boutons
Le bouton de clic Selenium est accessible en utilisant la méthode click ().
Dans l'exemple ci-dessus
- Trouvez le bouton pour vous connecter
- Cliquez sur le bouton "Connexion" dans la page de connexion du site pour vous connecter au site.
Soumettre des boutons
Les boutons Soumettre sont utilisés pour soumettre l'ensemble du formulaire au serveur. Nous pouvons soit utiliser la méthode click () sur l'élément Web comme un bouton normal comme nous l'avons fait ci-dessus, soit utiliser la méthode submit () sur n'importe quel élément Web du formulaire ou sur le bouton d'envoi lui-même.
Lorsque submit () est utilisé, WebDriver recherche le DOM pour savoir à quel formulaire appartient l'élément, puis déclenche sa fonction d'envoi.
Code complet
Voici le code de travail complet
import org.openqa.selenium.By;import org.openqa.selenium.WebDriver;import org.openqa.selenium.chrome.ChromeDriver;import org.openqa.selenium. *;Formulaire de classe publique {public static void main (String [] args) {// déclaration et instanciation d'objets / variablesSystem.setProperty ("webdriver.chrome.driver", "G: \\ chromedriver.exe");Pilote WebDriver = nouveau ChromeDriver ();String baseUrl = "http://demo.guru99.com/test/login.html";driver.get (baseUrl);// Récupère le WebElement correspondant à l'adresse e-mail (TextField)WebElement email = driver.findElement (By.id ("email"));// Récupère le WebElement correspondant au champ de mot de passeMot de passe WebElement = driver.findElement (Par.nom ("passwd"));email.sendKeys (" Cette adresse e-mail est protégée contre les robots spammeurs. Vous devez activer le JavaScript pour la visualiser.");password.sendKeys ("abcdefghlkjl");System.out.println ("Ensemble de champs de texte");// Suppression des valeurs dans la zone de texteemail.clear ();password.clear ();System.out.println ("Champ de texte effacé");// Trouver le bouton d'envoiConnexion WebElement = driver.findElement (By.id ("SubmitLogin"));// Utilisation de la méthode click pour soumettre le formulaireemail.sendKeys (" Cette adresse e-mail est protégée contre les robots spammeurs. Vous devez activer le JavaScript pour la visualiser."); password.sendKeys ("abcdefghlkjl"); login.click (); System.out.println ("Connexion effectuée avec un clic"); // en utilisant la méthode submit pour soumettre le formulaire. Soumettre utilisé sur le champ de mot de passe driver.get (baseUrl); driver.findElement (By.id ("email")). sendKeys (" Cette adresse e-mail est protégée contre les robots spammeurs. Vous devez activer le JavaScript pour la visualiser."); driver.findElement (Par.nom ("passwd")). sendKeys ("abcdefghlkjl"); driver.findElement (By.id ("SubmitLogin")). submit (); System.out.println ("Connexion terminée avec Soumettre"); // pilote.close (); }}
Dépannage
Si vous rencontrez NoSuchElementException () lors de la recherche d'éléments, cela signifie que l'élément n'est pas trouvé dans la page au moment où le pilote Web a accédé à la page.
- Vérifiez à nouveau votre localisateur en utilisant Firepath ou Inspect Element dans Chrome.
- Vérifiez si la valeur que vous avez utilisée dans le code est différente de celle de l'élément dans Firepath maintenant.
- Certaines propriétés sont dynamiques pour quelques éléments. Si vous constatez que la valeur est différente et change dynamiquement, envisagez d'utiliser By.xpath () ou By.cssSelector () qui sont des méthodes plus fiables mais complexes.
- Parfois, cela peut également être un problème d'attente, c'est-à-dire que le pilote Web a exécuté votre code avant même que la page ne soit complètement chargée, etc.
- Ajoutez une attente avant findElement () en utilisant des attentes implicites ou explicites.
Résumé
- Le tableau ci-dessous résume les commandes pour accéder à chaque type d'élément discuté ci-dessus
| Élément | Commander | Description |
|---|---|---|
| Zone de saisie | sendKeys () | utilisé pour saisir des valeurs dans des zones de texte |
| dégager() | utilisé pour effacer les zones de texte de sa valeur actuelle | |
| Liens | Cliquez sur() | utilisé pour cliquer sur le lien et attendre la fin du chargement de la page avant de passer à la commande suivante. |
| Bouton de soumission | nous faire parvenir() |
- WebDriver permet la sélection de plusieurs options dans un élément SELECT multiple.
- Vous pouvez utiliser la méthode submit () sur n'importe quel élément du formulaire. WebDriver déclenchera automatiquement la fonction d'envoi du formulaire auquel appartient cet élément.