Het vinden van elementen op de webpagina kan een nachtmerrie zijn vanwege de complexiteit van webelementen. Web elementen spelen echter een vitale rol bij het ontwikkelen en testen van een applicatie. Om het testers gemakkelijker te maken, zal dit artikel enig inzicht bieden in Selenium findElement en findElements aan de hand van een voorbeeld.
Hier volgt wat het artikel zal behandelen:
- Inleiding tot Selenium findElement
- Verschil tussen findElement en findElements
- Syntax van Selenium findElement
- Types van locators
- Het gebruik van locator strategie voor findElement
Inleiding tot Selenium findElement
Interactie met een webpagina vereist dat de driver een webelement lokaliseert en ofwel een JavaScript-event zoals een klik activeert, enter, select, enz. of de veldwaarde in te typen. Gewoonlijk begint men met het geautomatiseerd testen van een web-app met het vinden van relevante web-elementen op de webpagina. Meestal worden dergelijke geautomatiseerde tests uitgevoerd met behulp van frameworks als Selenium WebDriver.
Selenium definieert twee methoden voor het identificeren van webelementen:
- findElement: Een commando dat wordt gebruikt om een webelement binnen de webpagina op unieke wijze te identificeren.
- findElements: Een opdracht die wordt gebruikt om een lijst van webelementen binnen de webpagina te identificeren.
Laten we het verschil tussen deze twee methoden nader begrijpen.
Verschil tussen findElement en findElements
| findElement | findElements |
| Haalt het eerste overeenkomende webelement terug als er meerdere webelementen door de locator zijn gevonden | Haalt een lijst van meerdere overeenkomende webelementen |
| Gooit NoSuchElementException als het element niet wordt gevonden | Stuurt een lege lijst terug als er geen overeenkomend element is gevonden |
| Ontdekt een uniek web element | Retourneert een verzameling overeenkomende elementen |
Om enkele fundamentele Selenium-commando’s te begrijpen, kijk dan eens naar Basiscommando’s van Selenium Webdriver.
Syntax van Selenium findElement
Het findElement commando retourneert een object van het type WebElement. Het kan gebruik maken van verschillende locator strategieën zoals ID, Name, ClassName, link text, XPath, etc.
Hieronder staat de syntax:
WebElement elementName = driver.findElement(By.LocatorStrategy("LocatorValue"));
Locator Strategie bestaat uit de volgende waarden.
- ID
- Name
- Class Name
- Tag Name
- Link Text
- XPath
Locator Value is de unieke methode waarmee men het webelement gemakkelijk kan identificeren.
Exemplarisch:
driver.findElement(By.xpath("//input")).sendKeys("Guitar");
Syntax van Selenium findElements
Het commando findElements retourneert een lege lijst als er geen elementen zijn gevonden met de opgegeven locator-strategie en locator-waarde. Hieronder staat de syntaxis van het commando findElements.
List<WebElement> elementName = driver.findElements(By.LocatorStrategy("LocatorValue"));
Example:
List<WebElement> listOfElements = driver.findElements(By.xpath("//div"));
Probeer Selenium Testen gratis
Nu gaan we dieper in op het vinden van web elementen met behulp van verschillende locators. Men kan verwijzen naar verschillende soorten locators in Selenium.
Laten we eens begrijpen hoe Selenium findElement op verschillende manieren kan gebruiken:
Vind op ID
ID is uniek gedefinieerd voor elk element en is de meest gebruikelijke manier om elementen te vinden met behulp van ID Locator. Als een website dynamisch gegenereerde ids heeft, dan kan deze strategie niet worden gebruikt om een element uniek te vinden. Het zal echter het eerste webelement retourneren dat overeenkomt met de locator.
Voorbeeld: Laten we www.amazon.com nemen voor het automatiseren en vinden van de elementen. Als iemand door het zoekvak navigeert en het element inspecteert, ziet hij verschillende webelementen, zoals in de onderstaande momentopname.
Zoals u kunt zien, bevat het een ID-locator waarvan de waarde twotabsearchtextbox is. Het onderstaande knipsel gebruikt dezelfde locatorwaarde om een programma te schrijven.
Vinden op naam
Dit is vergelijkbaar met Vinden op ID, behalve dat de driver een element op “naam”-attribuut vindt in plaats van op “id”.
Voorbeeld: Beschouw dezelfde amazon webpagina. Het zoekvak heeft ook een naamzoeker waarvan de waarde “field-keywords” is, zoals te zien is in de snapshot hieronder.
De hele code blijft gelijk aan die van ID locator, behalve dat het verschil in de findElement-syntax zit.
elementName = driver.findElement(By.name("field-keywords"))
Vinden op LinkTekst
LinkTekst is nuttig om links in een webpagina te vinden. Het is de meest efficiënte manier om webelementen te vinden die links bevatten.
Nu, zoek een Returns-link zoals hieronder wordt getoond.
Wanneer de tester die link aanklikt en inspecteert, wordt de linktekst Returns gelokaliseerd zoals in de onderstaande momentopname wordt getoond.
Dit kan eenvoudig worden gevonden door Selenium findElement te gebruiken met de onderstaande syntaxis:
elementLinktext = driver.findElement(By.linkText("Returns”))
Find By CSS Selector
CSS Selector wordt gebruikt om stijlregels voor webpagina’s te bieden en kan ook worden gebruikt om een of meer webelementen te identificeren.
Voorbeeld: Beschouw hetzelfde zoekvak van de Amazon-pagina. Het heeft een class attribuut waarvan de waarde nav-search-input is. Met dezelfde waarde kan de Selenium findElement-methode het element lokaliseren.
elementcss= driver.findElement(By.cssSelector('div.nav-search-input'))
Find By XPath
XPath is een techniek in Selenium om door de HTML-structuur van een pagina te navigeren. XPath stelt testers in staat om door de XML-structuur van een document te navigeren en kan worden gebruikt op zowel HTML- als XML-documenten.
Voorbeeld: Laten we proberen dezelfde zoekbalk in Amazon te lokaliseren met behulp van XPath. De code hieronder laat zien dat het een ID locator bevat. Merk op dat relatieve XPath begint met ‘//’.
In de afbeelding hieronder ziet men een input tag. Begin met //input. Hier impliceert //input een tag-naam. Maak gebruik van het id attribuut en geef als waarde twotabsearchtextbox tussen enkele aanhalingstekens. Dit levert de hieronder getoonde XPath expressie op:
//input
Nu, met behulp van de Selenium findElement methode, voert u de onderstaande code uit:
elementxpath = driver.findElement(By.xpath("//input"))
Run Selenium Tests gratis op echte apparaten
Het lokaliseren van webelementen staat aan de basis van het geautomatiseerd Selenium testen van websites en web-apps. Om meer te weten te komen over de basisprincipes van Selenium, bekijk dan de Selenium WebDriver Tutorial.