Kako provjeriti Tooltip u Selenium webdriver
Krishna Rungta
Opis alata u Selenium
A Opis alata u Selenium je tekst koji se pojavljuje kada mišem prijeđete iznad objekta na web stranici. Objekt može biti poveznica, slika, gumb, tekstualno područje, itd. Tekst tooltip-a često daje više informacija o objektu na kojem korisnik lebdi iznad pokazivača miša.
Opisi alata tradicionalno su implementirani kao atribut 'naslova' elementa. Vrijednost ovog atributa prikazana je kao opis alata pri prelasku miša. Ovo je statični tekst koji daje informacije o elementu bez stiliziranja.
Sada postoji mnogo dodataka dostupnih za implementaciju 'savjeta za alat'. Napredni opisi alata sa stilom, renderiranjem, slikama i vezama implementiraju se pomoću JavaScript/JQuery dodaci ili korištenje CSS Tooltips.
- Za pristup ili provjeru statičkih opisa alata koji su implementirani pomoću HTML atributa "title", možemo jednostavno koristiti metodu getAttribute("title") WebElementa. Vraćena vrijednost ove metode (koja je tekst opisa alata) uspoređuje se s očekivanom vrijednošću za provjeru.
- Za druge oblike implementacija opisa alata, morat ćemo upotrijebiti "API za napredne korisničke interakcije" koji nudi Web Driver za stvaranje efekta lebdenja mišem i zatim dohvatiti opis alata za element.
Ukratko o API-ju naprednih korisničkih interakcija
API za napredne korisničke interakcije pruža API za radnje korisnika poput povlačenja i ispuštanja, lebdenja, višestrukog odabira, pritiskanja i otpuštanja tipki i drugih radnji pomoću tipkovnice ili miša na web stranici.
Možete uputiti ovo link za više detalja o API-ju.
Evo, pogledajmo kako upotrijebiti nekoliko klasa i metoda koje bi nam trebale za pomicanje elementa klizača za pomak.
Korak 1) Kako biste koristili API, potrebno je uvesti sljedeće pakete/klase:
Korak 2) Napravite objekt klase “Radnje” i izgradite slijed radnji korisnika. Klasa Actions koristi se za izgradnju niza korisničkih radnji kao što su moveToElement(), dragAndDrop() itd. Različite metode povezane s radnjama korisnika pružaju API.
Objekt pogonitelja daje se kao parametar svom konstruktoru.
Korak 3) Stvorite objekt akcije koristeći metodu build() klase “Akcije”. Pozovite metodu perform() da biste izvršili sve radnje koje je izradio objekt Actions (ovdje alat za izgradnju).
Vidjeli smo kako koristiti neke od metoda korisničkih radnji koje nudi API – clickAndHold(element), moveByOffset(10,0), release(). API nudi mnoge takve metode.
Pogledajte link za više detalja.
Kako provjeriti (rukovati) Tooltip u Selenium
Pogledajmo demonstraciju pristupa i provjere savjeta alata u jednostavnom scenariju
- Scenarij 1: Opis alata implementiran je pomoću atributa "title".
- Scenarij 2: Opis alata implementiran je pomoću dodatka jQuery.
Scenarij 1: HTML atribut 'title'
Za ovaj slučaj, uzmimo primjer stranice – https://demo.guru99.com/test/social-icon.html.
Pokušat ćemo provjeriti opis ikone "github" u gornjem desnom kutu stranice.
Da bismo to učinili, prvo ćemo pronaći element i dobiti njegov 'title' atribut te potvrditi s očekivanim tekstom savjeta alata.
Budući da pretpostavljamo da je savjet alata u atributu "title", ne automatiziramo efekt lebdenja mišem, već jednostavno dohvaćamo vrijednost atributa pomoću metode "getAttribute()".
Evo koda
import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.*;
public class ToolTip {
public static void main(String[] args) {
String baseUrl = "https://demo.guru99.com/test/social-icon.html";
System.setProperty("webdriver.chrome.driver","G:\\chromedriver.exe");
WebDriver driver = new ChromeDriver();
driver.get(baseUrl);
String expectedTooltip = "Github";
// Find the Github icon at the top right of the header
WebElement github = driver.findElement(By.xpath(".//*[@class='soc-ico show-round']/a[4]"));
//get the value of the "title" attribute of the github icon
String actualTooltip = github.getAttribute("title");
//Assert the tooltip's value is as expected
System.out.println("Actual Title of Tool Tip"+actualTooltip);
if(actualTooltip.equals(expectedTooltip)) {
System.out.println("Test Case Passed");
}
driver.close();
}
}
Objašnjenje koda
- Pronađite WebElement koji predstavlja ikonu "github".
- Dobijte njegov atribut "title" pomoću metode getAttribute().
- Usporedite vrijednost s očekivanom vrijednošću opisa alata.
Scenarij 2: JQuery dodatak
Dostupno je mnoštvo JQuery dodataka za implementaciju opisa alata, a svaki od njih ima nešto drugačiji oblik implementacije.
Neki dodaci očekuju da HTML opis alata bude prisutan cijelo vrijeme pored elementa za koji je opis alata primjenjiv, dok drugi stvaraju dinamičku oznaku "div", koja se pojavljuje u hodu dok lebdite iznad elementa.
Za našu demonstraciju, razmotrimo "jQuery Tools Tooltip" način implementacije tooltip-a.
Ovdje u URL-u – https://demo.guru99.com/test/tooltip.html možete vidjeti demo gdje kada mišem prijeđemo iznad "Preuzmi sada", dobivamo napredni opis alata sa slikom, pozadinom oblačića, tablicom i vezom unutar nje na koju se može kliknuti.
Ako pogledate izvor u nastavku, možete vidjeti da je oznaka div koja predstavlja opis alata uvijek prisutna pored oznake veze "Preuzmi sada". No, kod unutar oznake skripte u nastavku kontrolira kada treba iskočiti.
Pokušajmo provjeriti samo tekst veze u opisu alata za našu demonstraciju ovdje.
Prvo ćemo pronaći WebElement koji odgovara "Preuzmi sada". Zatim ćemo se pomoću Interactions API-ja pomaknuti na element (lebdenje mišem). Zatim ćemo pronaći WebElement koji odgovara vezi unutar prikazanog opisa alata i provjeriti ga u odnosu na očekivani tekst.
Evo koda
import org.openqa.selenium.interactions.Action;
import org.openqa.selenium.interactions.Actions;
import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.*;
public class JqueryToolTip {
public static void main(String[] args) {
String baseUrl = "https://demo.guru99.com/test/tooltip.html";
System.setProperty("webdriver.chrome.driver","G:\\chromedriver.exe");
WebDriver driver = new ChromeDriver();
String expectedTooltip = "What's new in 3.2";
driver.get(baseUrl);
WebElement download = driver.findElement(By.xpath(".//*[@id='download_now']"));
Actions builder = new 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("Actual Title of Tool Tip "+actualTooltip);
if(actualTooltip.equals(expectedTooltip)) {
System.out.println("Test Case Passed");
}
driver.close();
}
}
Objašnjenje koda
- Pronađite WebElement koji odgovara elementu "preuzmi sada" na koji ćemo mišem prijeći.
- Koristeći Interactions API, pokazivačem miša prijeđite na "Preuzmi sada".
- Pod pretpostavkom da je prikazan opis alata, pronađite WebElement koji odgovara vezi unutar opisa alata, tj. oznaku "a".
- Provjerite tekst opisa veze dohvaćen pomoću getText() u odnosu na očekivanu vrijednost koju smo pohranili u “expectedToolTip”
Rezime
U ovom ste vodiču naučili kako pristupiti opisima alata pomoću Selenium Web upravljački program.
Savjeti za alate implementiraju se na različite načine –
- Osnovna implementacija temelji se na HTML atributu “title”. getAttribute(title) dobiva vrijednost opisa alata.
- Druge implementacije savjeta alata kao što su JQuery, CSS opisi zahtijevaju Interactions API za stvaranje efekta lebdenja mišem
API za napredne korisničke interakcije–
- moveToElement(element) klase Actions koristi se za prelazak mišem na element.
- Metoda Build() klase Actions gradi niz korisničkih radnji u objekt Action.
- Perform() of Action klasa izvršava sav niz korisničkih akcija odjednom.
Kako bismo provjerili opis alata, prvo moramo mišem prijeći na element, zatim pronaći element koji odgovara savjetu alata i dobiti njegov tekst ili druge vrijednosti za provjeru u odnosu na očekivane vrijednosti.
