Jak zweryfikować podpowiedź w Selenium

Podpowiedź w Selenium

A Podpowiedź w Selenium to krótki tekst wyświetlany po najechaniu kursorem myszy na obiekt na stronie internetowej. Obiektem może być link, obraz, przycisk lub pole tekstowe. Tekst podpowiedzi często zawiera więcej informacji o elemencie znajdującym się pod kursorem.

Podpowiedzi były tradycyjnie implementowane jako atrybut „title” w elemencie. Wartość tego atrybutu była wyświetlana jako podpowiedź po najechaniu myszką. Jest to statyczny tekst, który zawiera informacje o elemencie, bez stylizacji.

Obecnie dostępnych jest wiele wtyczek do implementacji podpowiedzi. Zaawansowane podpowiedzi ze stylami, renderowaniem, obrazami i linkami są tworzone przy użyciu JavaSkrypty lub wtyczki jQuery, albo podpowiedzi wyłącznie w formacie CSS.

• Aby uzyskać dostęp do statycznych podpowiedzi zaimplementowanych za pomocą atrybutu HTML „title” lub je zweryfikować, należy użyć getAttribute("title") Metoda WebElement. Zwracana wartość (tekst podpowiedzi) jest porównywana z wartością oczekiwaną w celu weryfikacji.
• W przypadku implementacji innych podpowiedzi użyj interfejsu API zaawansowanych interakcji użytkownika udostępnionego przez WebDriver, aby utworzyć efekt najechania kursorem myszy na element, a następnie pobierz podpowiedź dla elementu.

Krótki opis interfejsu API zaawansowanych interakcji użytkownika

Interfejs API zaawansowanych interakcji użytkownika udostępnia takie działania użytkownika, jak przeciąganie i upuszczanie, najeżdżanie kursorem, zaznaczanie wielu elementów, naciskanie i zwalnianie klawiszy oraz inne działania klawiatury lub myszy na stronie internetowej.

Możesz się do tego odnieść oficjalne odniesienie do klasy Actions Więcej szczegółów na temat API znajdziesz tutaj.

Przed skokiemping Przyjrzyjmy się scenariuszom, w których klasy i metody są potrzebne do przesunięcia elementu suwaka o przesunięcie.

Krok 1) Aby skorzystać z API, zaimportuj następujące pakiety i klasy:

Krok 2) Utwórz obiekt klasy „Actions” i zbuduj sekwencję akcji użytkownika. Klasa Actions buduje akcje łańcuchowe, takie jak moveToElement() i dragAndDrop(). Obiekt sterownika jest przekazywany jako parametr do jego konstruktora.

Krok 3) Utwórz obiekt akcji za pomocą metody build() klasy „Actions”. Wywołaj metodę perform(), aby wykonać każdą akcję z kolejki w konstruktorze.

Widzieliśmy, jak korzystać z niektórych metod akcji użytkownika udostępnianych przez API: clickAndHold(element), moveByOffset(10, 0) i release(). API udostępnia ich o wiele więcej.

Implementacja podpowiedzi w porównaniu Selenium Podejście weryfikacyjne

Jak zweryfikować (obsługiwać) podpowiedź w Selenium

Przeanalizujmy teraz uzyskiwanie dostępu do podpowiedzi i ich weryfikację na podstawie dwóch typowych scenariuszy:

• Scenariusz 1: Podpowiedź jest implementowana przy użyciu atrybutu „title”.
• Scenariusz 2: Podpowiedź jest implementowana za pomocą wtyczki jQuery.

Scenariusz 1: Atrybut HTML „title”

W tym przypadku korzystamy z przykładowej witryny https://demo.guru99.com/test/social-icon.html i sprawdź podpowiedź ikony „github” w prawym górnym rogu strony.

Najpierw lokalizujemy element, następnie odczytujemy jego atrybut „title” i porównujemy go z oczekiwanym tekstem podpowiedzi.

Ponieważ podpowiedź znajduje się w atrybucie „title”, nie automatyzujemy nawet najechania kursorem myszy na obiekt; po prostu pobieramy wartość atrybutu za pomocą metody getAttribute().

Oto kod:

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

Wyjaśnienie kodu:

1. Znajdź element WebElement reprezentujący ikonę „github”.
2. Odczytaj atrybut „title” za pomocą metody getAttribute().
3. Potwierdź wartość na podstawie oczekiwanego tekstu podpowiedzi.

Selenium 4 wskazówka: Woleć getDomAttribute("title") dla dosłownego atrybutu HTML i pozwól Selenium Menedżer rozwiązuje problem ze sterownikiem zamiast kodowania na stałe chromedriver.exe.

Scenariusz 2: Wtyczka jQuery

Wiele wtyczek jQuery implementuje podpowiedzi, ale każda z nich wyświetla się nieco inaczej.

Niektóre wtyczki stale umieszczają znacznik podpowiedzi obok elementu wyzwalacza, podczas gdy inne dynamicznie tworzą znacznik „div” w momencie, gdy kursor znajdzie się w wyzwalaczu.

Na potrzeby tej demonstracji wykorzystamy styl „jQuery Tools Tooltip”.

Otwarte https://demo.guru99.com/test/tooltip.html; najechanie kursorem na „Pobierz teraz” spowoduje wyświetlenie zaawansowanej podpowiedzi z obrazem, tłem z objaśnieniami, małą tabelą i klikalnym linkiem.

Jeśli przyjrzysz się kodowi źródłowemu, zauważysz, że div reprezentujący podpowiedź znajduje się już obok linku „Pobierz teraz”. Poniższy znacznik skryptu kontroluje, kiedy się pojawi.

Teraz sprawdzamy tekst łącza wyświetlany wewnątrz podpowiedzi.

Najpierw znajdź element WebElement dla opcji „Pobierz teraz”. Użyj interfejsu API interakcji, aby przejść do elementu (najedź myszką). Następnie znajdź element WebElement, który odpowiada linkowi w wyświetlanej podpowiedzi i sprawdź, czy jego tekst jest zgodny z oczekiwaną wartością.

Oto kod:

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 Wyjaśnienie:

1. Znajdź WebElement, który jest odwzorowywany na element „Pobierz teraz”, nad którym najedziesz myszką.
2. Za pomocą interfejsu API interakcji najedź kursorem na opcję „Pobierz teraz”.
3. Gdy podpowiedź będzie już widoczna, znajdź WebElement reprezentujący łącze wewnątrz podpowiedzi (znacznik „a”).
4. Przeczytaj tekst podpowiedzi za pomocą getText() i porównaj ją z wartością oczekiwaną zapisaną w expectedTooltip.

FAQ