Az eszköztipp ellenőrzése Selenium

Eszköztipp be Selenium

A Eszköztipp be Selenium egy olyan szöveg, amely akkor jelenik meg, amikor az egeret egy weboldalon lévő objektum fölé viszi. Az objektum lehet hivatkozás, kép, gomb, szövegterület stb. Az eszköztipp szövege gyakran több információt ad arról az objektumról, amelyen a felhasználó az egérkurzort tartja.

Az eszköztippeket hagyományosan egy elem „title” attribútumaként valósították meg. Ennek az attribútumnak az értéke eszközleírásként jelent meg az egér lebegtetésekor. Ez egy statikus szöveg, amely stílus nélkül ad információt az elemről.

Most már számos bővítmény áll rendelkezésre az „eszköztippek” megvalósításához. Speciális eszköztippek stílussal, rendereléssel, képekkel és hivatkozásokkal valósul meg JavaScript/JQuery beépülő modulok vagy CSS Tooltips segítségével.

• A HTML „title” attribútum használatával megvalósított statikus eszköztippek eléréséhez vagy ellenőrzéséhez egyszerűen használhatjuk a WebElement getAttribute(“title”) metódusát. Ennek a módszernek a visszaadott értékét (amely az eszköztipp szövege) a rendszer összehasonlítja a várt értékkel ellenőrzés céljából.
• Az eszköztipp-megvalósítások egyéb formáihoz a Web Driver által biztosított „Advanced User Interactions API”-t kell használnunk az egérmutató effektus létrehozásához, majd az elemhez tartozó eszköztipp lekéréséhez.

Az Advanced User Interactions API rövid ismertetése

Az Advanced User Interactions API biztosítja az API-t olyan felhasználói műveletekhez, mint a fogd és vidd, a lebegtetés, a többszöri kijelölés, a billentyűk lenyomása és felengedése, valamint a billentyűzettel vagy egérrel végzett egyéb műveletek egy weboldalon.

Erre hivatkozhatsz link az API-val kapcsolatos további részletekért.

Itt nézzük meg, hogyan használhatunk néhány olyan osztályt és metódust, amelyekre szükségünk lenne egy csúszkaelem eltolással történő mozgatásához.

Step 1) Az API használatához a következő csomagokat/osztályokat kell importálni:

Step 2) Hozzon létre egy objektumot az „Actions” osztályból, és építse fel a felhasználói műveletek sorozatát. Az Actions osztály a felhasználói műveletek sorozatának felépítésére szolgál, mint például a moveToElement(), dragAndDrop() stb. Az API különféle módszereket biztosít a felhasználói műveletekhez.

Az illesztőprogram-objektum paraméterként van megadva a konstruktor számára.

Step 3) Hozzon létre egy műveleti objektumot az „Actions” osztály build() metódusával. Hívja a perform() metódust az Actions objektum (itt a builder) által felépített összes művelet végrehajtásához.

Láttuk, hogyan kell használni néhány, az API által biztosított felhasználói műveleti metódust – clickAndHold(element), moveByOffset(10,0), release(). Az API számos ilyen módszert kínál.

Utal link fül alatt találsz.

Az eszköztipp ellenőrzése (kezelése) Selenium

Nézzük meg az eszköztippek elérésének és ellenőrzésének bemutatóját az egyszerű forgatókönyvben

• 1. forgatókönyv: Az eszköztipp a „title” attribútum használatával kerül megvalósításra
• 2. forgatókönyv: Az eszköztipp egy jQuery beépülő modul segítségével valósul meg.

1. forgatókönyv: HTML „title” attribútum

Erre az esetre vegyük a példaoldalt – https://demo.guru99.com/test/social-icon.html.

Megpróbáljuk ellenőrizni az oldal jobb felső sarkában található „github” ikon elemleírását.

Ehhez először megkeressük az elemet, megkapjuk a 'title' attribútumot, és ellenőrizzük a várt eszköztipp szöveggel.

Mivel feltételezzük, hogy az eszköz hegye a „title” attribútumban található, még csak nem is automatizáljuk az egér lebegtetési effektust, hanem egyszerűen lekérjük az attribútum értékét a „getAttribute()” metódussal.

Itt a kód

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();			
   }		
}		

A kód magyarázata

1. Keresse meg a „github” ikont képviselő WebElement elemet.
2. Szerezze be a „title” attribútumot a getAttribute() metódussal.
3. Állítsa be az értéket az eszköztipp várt értékéhez képest.

2. forgatókönyv: JQuery beépülő modul

Rengeteg JQuery beépülő modul áll rendelkezésre az eszköztippek megvalósításához, és mindegyiknek kissé eltérő megvalósítási formája van.

Egyes beépülő modulok azt várják, hogy az eszköztipp HTML mindig jelen legyen azon elem mellett, amelyre az eszköztipp vonatkozik, míg mások dinamikus „div” címkét hoznak létre, amely menet közben jelenik meg, miközben az elem fölé viszi az egérmutatót.

A bemutatóhoz tekintsük a „jQuery Tools Tooltip” eszköztipp megvalósítási módját.

Itt az URL-ben – https://demo.guru99.com/test/tooltip.html Megtekintheti a demót, ahol az egeret a „Letöltés most” fölé tartva egy speciális eszköztippet kapunk képpel, kiemelés hátterével, táblázattal és benne egy kattintható hivatkozással.

Ha megnézi az alábbi forrást, láthatja, hogy az eszköztippet képviselő div címke mindig megtalálható a „Letöltés most” link címkéje mellett. De az alábbi szkriptcímkén belüli kód szabályozza, hogy mikor kell felbukkannia.

Próbáljuk meg csak a linkszöveget ellenőrizni a bemutató eszköztippében.

Először a „Letöltés most”-nak megfelelő WebElement-et fogjuk megtalálni. Ezután az Interactions API segítségével áttérünk az elemre (egér lebegtetése). Ezután megkeressük a megjelenített eszköztippen belül a hivatkozásnak megfelelő WebElement elemet, és ellenőrizzük a várt szöveggel.

Itt a kód

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();			
   }		
}		

Kód Magyarázat

1. Keresse meg azt a WebElementet, amely megfelel a „letöltés most” elemnek, amelyre az egeret mozgatjuk.
2. Az Interactions API használatával vigye az egeret a „Letöltés most” lehetőségre.
3. Feltételezve, hogy az eszköztipp megjelenik, keresse meg azt a WebElementet, amely megfelel az eszköztippen belüli hivatkozásnak, azaz az „a” címkének.
4. Ellenőrizzük a link elemleírásának szövegét, amelyet a getText() paranccsal találtunk meg, összehasonlítva a várható értékkel, amelyet az „expectedToolTip”-ben tároltunk.

Összegzésként

Ebből az oktatóanyagból megtanulta, hogyan érheti el az Eszköztippeket a használatával Selenium Web illesztőprogram.

Az eszköztippeket különböző módokon hajtják végre –

• Az alapvető megvalósítás a HTML „title” attribútumán alapul. A getAttribute(title) megkapja az eszköztipp értékét.
• Más eszköztipp-megvalósítások, például a JQuery, a CSS-eszköztippek interakciós API-t igényelnek az egér lebegtetési effektusának létrehozásához

Advanced User Interactions API –

• Az Actions osztály moveToElement(elem) eleme az egér egérrel való mozgatására szolgál.
• Az Actions osztály Build() metódusa a felhasználói műveletek sorozatát Action objektummá építi.
• Az Action osztály Perform() parancsa egyszerre hajtja végre a felhasználói műveletek összes sorozatát.

Az eszköztipp ellenőrzéséhez először az egeret kell mozgatnunk az elemre, majd meg kell találnunk az eszköztippnek megfelelő elemet, és be kell kérnünk annak szövegét vagy más értékeit, amelyek ellenőrzik a várt értékeket.