Hur du verifierar verktygstips i Selenium

Verktygstips i Selenium

A Verktygstips i Selenium är en kort text som visas när muspekaren håller muspekaren över ett objekt på en webbsida. Objektet kan vara en länk, en bild, en knapp eller ett textområde. Verktygstipstexten ger ofta mer information om elementet under markören.

Verktygstips implementerades traditionellt som ett "title"-attribut på ett element. Värdet på detta attribut visades som ett verktygstips när muspekaren hölls över det. Detta är en statisk text som ger information om elementet utan styling.

Idag finns många plugins tillgängliga för implementering av verktygstips. Avancerade verktygstips med styling, rendering, bilder och länkar byggs med hjälp av JavaSkript- eller jQuery-plugins, eller med endast CSS-verktygstips.

• För att komma åt eller verifiera statiska verktygstips som implementerats via HTML-attributet "title", använd getAttribute("title") metoden på WebElement. Det returnerade värdet (verktygstipstexten) jämförs med ett förväntat värde för verifiering.
• För andra implementeringar av verktygstips, använd "Advanced User Interactions API" som tillhandahålls av WebDriver för att skapa muspekareffekten och hämta sedan verktygstipset för elementet.

Kort om Advanced User Interactions API

Advanced User Interactions API exponerar användaråtgärder som dra och släpp, hovra över, markera flera element, trycka och släppa tangenter och andra tangentbords- eller musåtgärder på en webbsida.

Du kan hänvisa till detta officiell referens för Actions-klassen för mer information om API.

Före hoppping I scenarier, låt oss titta på de klasser och metoder vi behöver för att flytta ett skjutreglageelement med en förskjutning.

Steg 1) För att använda API:et, importera följande paket och klasser:

Steg 2) Skapa ett objekt av klassen "Actions" och bygg sekvensen av användaråtgärder. Klassen Actions bygger länkade åtgärder som moveToElement() och dragAndDrop(). Drivrutinsobjektet skickas som en parameter till dess konstruktor.

Steg 3) Skapa ett Action-objekt med hjälp av build()-metoden i klassen "Actions". Anropa perform()-metoden för att utföra varje köad åtgärd i byggaren.

Vi har sett hur man använder några av de användaråtgärdsmetoder som tillhandahålls av API:et: clickAndHold(element), moveByOffset(10, 0) och release(). API:et exponerar många fler.

Verktygstipsimplementering vs. Selenium Verifieringsmetod

Hur du verifierar (hanterar) verktygstips i Selenium

Låt oss gå igenom hur man får åtkomst till och verifierar verktygstips med två vanliga scenarier:

• Scenario 1: Verktygstips implementeras med attributet ”title”.
• Scenario 2: Verktygstips implementeras med hjälp av ett jQuery-plugin.

Scenario 1: HTML-attributet "title"

I det här fallet använder vi exempelwebbplatsen https://demo.guru99.com/test/social-icon.html och verifiera verktygstipset för "github"-ikonen längst upp till höger på sidan.

Vi lokaliserar först elementet, läser sedan dess "title"-attribut och jämför det med den förväntade verktygstipstexten.

Eftersom verktygstipset finns i attributet "title" automatiserar vi inte ens muspekaren; vi hämtar helt enkelt attributvärdet med metoden getAttribute().

Här är koden:

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]"));

        // Read the "title" attribute value of the Github icon
        String actualTooltip = github.getAttribute("title");

        // Assert that the tooltip value matches the expected one
        System.out.println("Actual Title of Tool Tip " + actualTooltip);
        if (actualTooltip.equals(expectedTooltip)) {
            System.out.println("Test Case Passed");
        }
        driver.close();
    }
}

Förklaring av kod:

1. Hitta WebElement som representerar "github"-ikonen.
2. Läs dess "title"-attribut med metoden getAttribute().
3. Hävda värdet mot den förväntade verktygstipstexten.

Selenium 4 tips: Föredra getDomAttribute("title") för det litterala HTML-attributet, och låt Selenium Manager löser drivrutinen istället för att hårdkoda chromedriver.exe.

Scenario 2: jQuery-plugin

Många jQuery-plugins implementerar verktygstips, och var och en renderas något annorlunda.

Vissa plugin-program behåller verktygstipsmarkeringen bredvid trigger-elementet hela tiden, medan andra skapar en "div"-tagg dynamiskt när markören placeras på triggern.

För den här demonstrationen använder vi stilen ”jQuery Tools Tooltip”.

Öppet https://demo.guru99.com/test/tooltip.html; om du håller muspekaren över "Ladda ner nu" visas ett avancerat verktygstips med en bild, en bakgrund med en bildtext, en liten tabell och en klickbar länk.

Om du granskar källkoden finns div-filen som representerar verktygstipset redan bredvid länken "Ladda ner nu". Skripttaggen nedan styr när den visas.

Nu verifierar vi länktexten som visas i verktygstipset.

Leta först reda på WebElement för "Ladda ner nu". Använd Interactions API för att flytta till elementet (håll muspekaren över det). Leta sedan reda på WebElement som mappas till länken inuti den visade verktygstipsen och verifiera dess text mot det förväntade värdet.

Här är koden:

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

        // Hover over the "Download now" link to reveal the tooltip
        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();
    }
}

Code Förklaring:

1. Leta reda på det WebElement som är kopplat till elementet ”Ladda ner nu” som du håller muspekaren över.
2. Använd Interactions API för att hålla markören över "Ladda ner nu".
3. När verktygstipset är synligt, leta reda på WebElement som representerar länken inuti verktygstipset ("a"-taggen).
4. Läs verktygstipstexten med getText() och jämför det med det förväntade värdet som lagrats i expectedTooltip.

Vanliga frågor