WebElement in Selenium

WebElement in Selenium

Formulieren zijn de fundamentele elementen van een website waarmee informatie van bezoekers wordt verzameld. Webformulieren bevatten verschillende grafische gebruikersinterface-elementen zoals tekstvakken, wachtwoordvelden, selectievakjes, keuzerondjes, keuzemenu's en bestandsinvoervelden.

Deze handleiding legt uit hoe je toegang krijgt tot elk formulierelement met behulp van Selenium WebDriver met Java. Selenium kapselt elk formulierelement in als een object van WebElement. Het biedt een API om elementen te lokaliseren en erop te reageren, zoals tekst invoeren, op knoppen klikken en formulieren verzenden. De onderstaande secties beschrijven de beschikbare methoden voor elk formulierelement.

Inleiding tot WebElement, findElement(), findElements()

Selenium WebDriver representeert een eenvoudig formulierelement als een object van WebElement.

WebDriver identificeert formulierelementen aan de hand van verschillende eigenschappen van het webelement, waaronder ID, naam en klasse. XPath, Tagnaam, CSS-selectors en linktekst.

WebDriver biedt de volgende twee WebElement-methoden om elementen te vinden:

• zoekElement() – zoekt een enkel web-element en retourneert dit als een WebElement Selenium voorwerp.
• vindElementen() – retourneert een lijst met WebElement-objecten die voldoen aan de locatorcriteria.

Het onderstaande voorbeeld laat zien hoe je een enkel element, een tekstveld op een webpagina, als een WebElement-object kunt ophalen met behulp van de findElement()-methode. De findElements()-methode voor het vinden van meerdere elementen wordt in latere tutorials behandeld.

Stap 1) Importeer het pakket dat nodig is om WebElement-objecten te maken.

Stap 2) Roep de findElement()-methode van de WebDriver-klasse aan om een ​​WebElement-object op te halen, zoals hieronder weergegeven.

Selenium Voer tekst in

Met invoervakken wordt een van de volgende twee typen bedoeld:

1. Tekstvelden - Selenium Invoervelden die getypte waarden accepteren en deze exact weergeven zoals ze zijn ingevoerd.
2. Wachtwoordvelden – tekstvakken die ingevoerde waarden accepteren, maar deze maskeren als een reeks speciale tekens (meestal punten of sterretjes) om gevoelige invoer te verbergen.

   

Zoekers

De findElement()-methode accepteert één parameter, namelijk een locator die naar het element verwijst. Verschillende locators, waaronder By.id(), By.name(), By.xpath() en By.cssSelector(), vinden elementen op de pagina aan de hand van hun eigenschappen zoals id, naam of pad.

Je kunt plugins zoals FirePath gebruiken om de id, xpath en andere locatorwaarden voor elementen te verkrijgen.

Met behulp van de voorbeeldsite https://demo.guru99.com/test/login.htmlDe onderstaande code lokaliseert het tekstveld "E-mailadres" met behulp van de id-locator en het veld "Wachtwoord" met behulp van de name-locator.

1. Het tekstveld voor e-mails wordt gevonden op basis van het ID.
2. Het wachtwoordveld bevindt zich op naam.

sleutels insturen Selenium

sendKeys() in Selenium `sendKeys()` is een methode die gebruikt wordt om bewerkbare inhoud in tekst- en wachtwoordvelden in te voeren tijdens de testuitvoering. Deze velden worden geïdentificeerd aan de hand van locators zoals `name`, `class` en `id`. De methode is beschikbaar op het `WebElement`-object. In tegenstelling tot de `type`-methode vervangt `sendKeys()` de bestaande tekst in een tekstvak niet.

Hoe tekst in te voeren Selenium

Om tekst in tekstvelden en wachtwoordvelden in te voeren, is de methode sendKeys() beschikbaar op het WebElement. Selenium.

Met hetzelfde voorbeeld van https://demo.guru99.com/test/login.htmlHet onderstaande codefragment zoekt het tekstveld en het wachtwoordveld op en voert tekst in. Selenium.

1. Zoek het tekstveld 'E-mailadres' met behulp van de ID-locator.
2. Zoek het veld 'Wachtwoord' met behulp van de naamzoeker.
3. Voer tekst in het "E-mailadres" in met behulp van de Selenium sendKeys-methode.
4. Voer een wachtwoord in het veld "Wachtwoord" in met behulp van de methode sendKeys().

Waarden in invoer verwijderen Boxes

De Doorzichtig() Deze methode verwijdert de tekst in een invoerveld. Deze methode heeft geen parameter nodig. Het onderstaande codefragment verwijdert de tekst uit de velden E-mail of Wachtwoord.

Selenium Klik op Knoppen

De Selenium De klikknop wordt benaderd via de click()-methode.

In het bovenstaande voorbeeld

1. Zoek de knop om in te loggen.
2. Klik op de knop 'Inloggen' op de inlogpagina van de website om je te authenticeren.

Selenium Knoppen voor verzenden

Met de verzendknop wordt het volledige formulier naar de server verzonden. Je kunt de `click()`-methode op het `WebElement` aanroepen, zoals hierboven weergegeven, of de `submit()`-methode gebruiken op een element in het formulier of op de verzendknop zelf.

Wanneer submit() wordt gebruikt, zoekt WebDriver in de DOM op tot welk formulier het element behoort en activeert vervolgens de submit-functie.

Volledige Code

Hier is de complete, werkende code.

import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.*;

public class Form {
    public static void main(String[] args) {

        // declaration and instantiation of objects/variables
        System.setProperty("webdriver.chrome.driver", "G:\\chromedriver.exe");
        WebDriver driver = new ChromeDriver();

        String baseUrl = "https://demo.guru99.com/test/login.html";
        driver.get(baseUrl);

        // Get the WebElement corresponding to the Email Address(TextField)
        WebElement email = driver.findElement(By.id("email"));

        // Get the WebElement corresponding to the Password Field
        WebElement password = driver.findElement(By.name("passwd"));

        email.sendKeys("abcd@gmail.com");
        password.sendKeys("abcdefghlkjl");
        System.out.println("Text Field Set");

        // Deleting values in the text box
        email.clear();
        password.clear();
        System.out.println("Text Field Cleared");

        // Find the submit button
        WebElement login = driver.findElement(By.id("SubmitLogin"));

        // Using click method to submit form
        email.sendKeys("abcd@gmail.com");
        password.sendKeys("abcdefghlkjl");
        login.click();
        System.out.println("Login Done with Click");

        // Using submit method to submit the form. Submit used on password field
        driver.get(baseUrl);
        driver.findElement(By.id("email")).sendKeys("abcd@gmail.com");
        driver.findElement(By.name("passwd")).sendKeys("abcdefghlkjl");
        driver.findElement(By.id("SubmitLogin")).submit();
        System.out.println("Login Done with Submit");

        // driver.close();
    }
}

Problemen oplossen

Als je een NoSuchElementException() tegenkomt tijdens het zoeken naar elementen, is het element op het moment dat WebDriver het probeerde te benaderen niet aanwezig op de pagina.

1. Controleer je locator opnieuw met FirePath of de optie 'Element inspecteren' in Chrome.
2. Controleer of de waarde die in de code wordt gebruikt, verschilt van de huidige waarde van het element zoals weergegeven in FirePath.
3. Sommige attributen zijn dynamisch voor bepaalde elementen. Als een waarde dynamisch verandert, schakel dan over naar By.xpath() of By.cssSelector(), die betrouwbaarder maar iets complexer zijn.
4. Soms is het probleem een ​​wachtvoorwaarde; WebDriver voert de code mogelijk uit voordat de pagina volledig is geladen.
5. Voeg een wachttijd toe vóór findElement() met behulp van impliciete of expliciete wachttijden.

Samenvatting

• De onderstaande tabel geeft een overzicht van de commando's om toegang te krijgen tot elk van de hierboven besproken elementtypen.

• Met WebDriver kunt u meer dan één optie selecteren in een meervoudig SELECT-element.
• Je kunt de submit()-methode gebruiken op elk element binnen het formulier. WebDriver activeert automatisch de submit-functie van het formulier waartoe het element behoort.

Veelgestelde vragen