Tooltip in Selenium
Een tooltip in Selenium is een tekst die verschijnt wanneer een muis over een object op een webpagina beweegt. Het object kan een link zijn, een afbeelding, een knop, een tekstgebied, enz. De tooltip-tekst geeft vaak meer informatie over het object waarop de gebruiker met de muiscursor zweeft.
Tooltips werden traditioneel geïmplementeerd als een 'titel'-attribuut voor een element. De waarde van dit attribuut werd getoond als een tooltip bij het aanwijzen van de muis. Dit is een statische tekst die informatie geeft over het element zonder opmaak.
Nu zijn er veel plug-ins beschikbaar voor de implementatie van 'tooltips'. Geavanceerde tooltips met styling, rendering, afbeeldingen en links worden geïmplementeerd met behulp van JavaScript / JQuery-plug-ins of met behulp van CSS-tooltips.
- Voor toegang tot of verificatie van de statische tooltips die zijn geïmplementeerd met behulp van het HTML-attribuut "title", kunnen we eenvoudig de methode getAttribute ("title") van het WebElement gebruiken. De geretourneerde waarde van deze methode (de tooltip-tekst) wordt ter verificatie vergeleken met een verwachte waarde.
- Voor andere vormen van tooltip-implementaties zullen we de "Advanced User Interactions API" moeten gebruiken die wordt geleverd door het webstuurprogramma om het muisaanwijzereffect te creëren en vervolgens de tooltip voor het element op te halen.
Een korte beschrijving van de API voor geavanceerde gebruikersinteracties:
Advanced User Interactions API biedt de API voor gebruikersacties zoals slepen en neerzetten, zweven, meervoudig selecteren, toetsaanslagen en loslaten en andere acties met toetsenbord of muis op een webpagina.
U kunt deze link raadplegen voor meer informatie over de API.
https://seleniumhq.github.io/selenium/docs/api/java/index.html?org/openqa/selenium/interactions/Actions.html
Laten we hier eens kijken hoe we een aantal klassen en methoden kunnen gebruiken die we nodig hebben om een schuifregelaar met een offset te verplaatsen.
Stap 1) Om de API te gebruiken, moeten de volgende pakketten / klassen worden geïmporteerd:
Stap 2) Maak een object van de klasse "Actions" en bouw de reeks gebruikersacties. De Actions-klasse wordt gebruikt om de opeenvolging van gebruikersacties op te bouwen, zoals moveToElement (), dragAndDrop () enz. API biedt verschillende methoden met betrekking tot gebruikersacties.
Het driverobject wordt als parameter aan zijn constructor geleverd.
Stap 3) Maak een Action Object met behulp van de build () methode van de "Actions" klasse. Roep de methode perform () aan om alle acties uit te voeren die zijn gebouwd door het Actions-object (hier builder).
We hebben gezien hoe we enkele van de gebruikersacties-methoden van de API kunnen gebruiken - clickAndHold (element), moveByOffset (10,0), release (). De API biedt veel van dergelijke methoden.
Raadpleeg de link voor meer details.
Tooltip-tekst ophalen in Selenium Webdriver
Laten we eens kijken naar de demonstratie van toegang tot en verificatie van de tooltips in het eenvoudige scenario
- Scenario 1: Tooltip wordt geïmplementeerd met behulp van het "title" -attribuut
- Scenario 2: Tooltip wordt geïmplementeerd met behulp van een jQuery-plug-in.
Scenario 1: HTML-kenmerk 'titel'
Laten we voor dit geval de voorbeeldsite nemen - http://demo.guru99.com/test/social-icon.html.
We zullen proberen de tooltip van het "github" -pictogram rechtsboven op de pagina te verifiëren.
Om dit te doen, zullen we eerst het element vinden en het 'title'-attribuut ophalen en verifiëren met de verwachte tooltiptekst.
Aangezien we aannemen dat de tooltip in het "title" -attribuut zit, automatiseren we niet eens het muis-zweefeffect, maar halen we eenvoudig de waarde van het attribuut op met behulp van de "getAttribute ()" - methode.
Hier is de code
import org.openqa.selenium.By;importeer org.openqa.selenium.WebDriver;importeer org.openqa.selenium.chrome.ChromeDriver;importeer org.openqa.selenium. *;ToolTip voor openbare klassen {public static void main (String [] args) {String baseUrl = "http://demo.guru99.com/test/social-icon.html";System.setProperty ("webdriver.chrome.driver", "G: \\ chromedriver.exe");WebDriver-stuurprogramma = nieuwe ChromeDriver ();driver.get (baseUrl);String verwachteTooltip = "Github";// Zoek het Github-pictogram in de rechterbovenhoek van de koptekstWebElement github = driver.findElement (By.xpath (".//*[@ class = 'soc-ico show-round'] / a [4]"));// verkrijg de waarde van het "title" -attribuut van het github-pictogramString actualTooltip = github.getAttribute ("title");// Beweren dat de waarde van de knopinfo is zoals verwachtSystem.out.println ("Werkelijke titel van tooltip" + actualTooltip);if (actualTooltip.equals (verwachtTooltip)) {System.out.println ("Testcase geslaagd");driver.close ();
Verklaring van code
- Zoek het WebElement dat het "github" -pictogram vertegenwoordigt.
- Haal het "title" -attribuut op met behulp van de methode getAttribute ().
- Bevestig de waarde ten opzichte van de verwachte tooltip-waarde.
Scenario 2: JQuery-plug-in:
Er zijn tal van JQuery-plug-ins beschikbaar om de tooltips te implementeren, en elk heeft een iets andere vorm van implementatie.
Sommige plug-ins verwachten dat de tooltip-HTML altijd aanwezig is naast het element waarvoor de tooltip van toepassing is, terwijl de andere een dynamische "div" -tag creëren, die direct verschijnt terwijl hij over het element zweeft.
Laten we voor onze demonstratie eens kijken naar de "jQuery Tools Tooltip" manier van tooltip implementatie.
Hier in de URL - http://demo.guru99.com/test/tooltip.html kun je de demo zien, waarbij we met de muis over "Nu downloaden" een geavanceerde tooltip krijgen met een afbeelding, bijschriftachtergrond, een tabel en een link erin waarop kan worden geklikt.
Als je naar de bron hieronder kijkt, kun je zien dat de div-tag die de knopinfo vertegenwoordigt altijd aanwezig is naast de tag van de "Nu downloaden" -link. Maar de code in de onderstaande scripttag bepaalt wanneer deze moet verschijnen.
Laten we proberen om alleen de linktekst in de knopinfo voor onze demonstratie hier te verifiëren.
We zullen eerst het WebElement vinden dat overeenkomt met "Nu downloaden". Met behulp van de Interactions API gaan we naar het element (muisaanwijzer). Vervolgens zullen we het WebElement vinden dat overeenkomt met de link in de weergegeven tooltip en deze vergelijken met de verwachte tekst.
Hier is de code
import org.openqa.selenium.interactions.Action;import org.openqa.selenium.interactions.Actions;import org.openqa.selenium.By;importeer org.openqa.selenium.WebDriver;importeer org.openqa.selenium.chrome.ChromeDriver;importeer org.openqa.selenium. *;openbare klasse JqueryToolTip {public static void main (String [] args) {String baseUrl = "http://demo.guru99.com/test/tooltip.html";System.setProperty ("webdriver.chrome.driver", "G: \\ chromedriver.exe");WebDriver-stuurprogramma = nieuwe ChromeDriver ();String verwachteTooltip = "Wat is er nieuw in 3.2";driver.get (baseUrl);WebElement download = driver.findElement (By.xpath (".//*[@ id = 'download_now']"));Actions builder = nieuwe Actions (driver);builder.clickAndHold (). moveToElement (download);builder.moveToElement (download) .build (). perform ();WebElement toolTipElement = driver.findElement (By.xpath (".//*[@ class = 'box'] / div / a"));String actualTooltip = toolTipElement.getText ();System.out.println ("Werkelijke titel van tooltip" + actualTooltip);if (actualTooltip.equals (verwachtTooltip)) {System.out.println ("Testcase geslaagd");driver.close ();
Code Verklaring
- Zoek het WebElement dat overeenkomt met het element "nu downloaden" dat we met de muis zullen laten zweven.
- Gebruik de Interactions API en beweeg de muisaanwijzer naar "Nu downloaden".
- Aangenomen dat de tooltip wordt weergegeven, zoek dan het WebElement dat overeenkomt met de link in de tooltip, dwz de "a" -tag.
- Verifieer de tooltip-tekst van de link die is opgehaald met de getText () tegen een verwachte waarde die we hebben opgeslagen in "verwachteToolTip"
Overzicht:
In deze tutorial hebt u geleerd hoe u Tooltips kunt openen met de Selenium Web-driver.
- Tooltips worden op verschillende manieren geïmplementeerd -
- De basisimplementatie is gebaseerd op het HTML-attribuut "titel". getAttribute (titel) krijgt de waarde van de tooltip.
- Andere tooltip-implementaties zoals JQuery, CSS-tooltips vereisen Interactions API om muisaanwijzereffecten te creëren
- API voor geavanceerde gebruikersinteracties
- moveToElement (element) van de klasse Actions wordt gebruikt om met de muis over een element te bewegen.
- De methode Build () van de klasse Actions bouwt de reeks gebruikersacties op in een Action-object.
- Perform () van Action class voert alle opeenvolging van gebruikersacties in één keer uit.
- Om een tooltip te verifiëren, moeten we eerst de muisaanwijzer op het element plaatsen, dan het element vinden dat overeenkomt met de tooltip en de tekst of andere waarden ophalen om te verifiëren met de verwachte waarden.