Cara Memverifikasi Tooltip di Selenium

Keterangan alat masuk Selenium

A Keterangan alat masuk Selenium Tooltip adalah teks singkat yang muncul ketika kursor mouse mengarahkan ke suatu objek di halaman web. Objek tersebut bisa berupa tautan, gambar, tombol, atau area teks. Teks tooltip sering memberikan informasi lebih lanjut tentang elemen di bawah kursor.

Tooltip secara tradisional diimplementasikan sebagai atribut "title" pada sebuah elemen. Nilai atribut ini ditampilkan sebagai tooltip saat kursor mouse diarahkan ke elemen tersebut. Ini adalah teks statis yang memberikan informasi tentang elemen tanpa gaya apa pun.

Saat ini, banyak plugin tersedia untuk implementasi tooltip. Tooltip canggih dengan penataan gaya, rendering, gambar, dan tautan dibangun menggunakan JavaPlugin skrip atau jQuery, atau hanya dengan tooltip berbasis CSS.

• Untuk mengakses atau memverifikasi tooltip statis yang diimplementasikan melalui atribut HTML “title”, gunakan getAttribute("title") Metode pada WebElement. Nilai yang dikembalikan (teks tooltip) dibandingkan dengan nilai yang diharapkan untuk verifikasi.
• Untuk implementasi tooltip lainnya, gunakan “Advanced User Interactions API” yang disediakan oleh WebDriver untuk membuat efek mouse-hover dan kemudian mengambil tooltip untuk elemen tersebut.

Sekilas tentang API Interaksi Pengguna Tingkat Lanjut

API Interaksi Pengguna Tingkat Lanjut mengekspos tindakan pengguna seperti seret dan lepas, mengarahkan kursor, memilih banyak item, menekan dan melepaskan tombol, serta tindakan keyboard atau mouse lainnya pada halaman web.

Anda dapat merujuk ke ini Referensi kelas Tindakan resmi untuk rincian lebih lanjut tentang API.

Sebelum melompatping Mari kita lihat berbagai skenario dan kelas serta metode yang kita perlukan untuk menggeser elemen slider dengan offset tertentu.

Langkah 1) Untuk menggunakan API, impor paket dan kelas berikut:

Langkah 2) Buat objek dari kelas “Actions” dan bangun urutan tindakan pengguna. Kelas Actions membangun tindakan berantai seperti moveToElement() dan dragAndDrop(). Objek driver diteruskan sebagai parameter ke konstruktornya.

Langkah 3) Buat objek Action menggunakan metode build() dari kelas “Actions”. Panggil metode perform() untuk mengeksekusi setiap aksi yang diantrekan pada builder.

Kita telah melihat cara menggunakan beberapa metode Aksi pengguna yang disediakan oleh API: clickAndHold(element), moveByOffset(10, 0), dan release(). API ini menyediakan lebih banyak lagi.

Implementasi Tooltip vs Selenium Pendekatan Verifikasi

Cara Memverifikasi (Menangani) Tooltip di Selenium

Mari kita bahas cara mengakses dan memverifikasi tooltip dengan dua skenario umum:

• Skenario 1: Tooltip diimplementasikan menggunakan atribut “title”.
• Skenario 2: Tooltip diimplementasikan menggunakan plugin jQuery.

Skenario 1: Atribut HTML “title”

Untuk kasus ini, kita menggunakan situs contoh. https://demo.guru99.com/test/social-icon.html dan periksa tooltip ikon “github” di pojok kanan atas halaman.

Pertama, kita temukan elemen tersebut, kemudian baca atribut “title”-nya dan bandingkan dengan teks tooltip yang diharapkan.

Karena tooltip berada di atribut “title”, kami bahkan tidak mengotomatiskan mouse-hover; kami cukup mengambil nilai atribut dengan metode getAttribute().

Ini kodenya:

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

Penjelasan kode:

1. Temukan WebElement yang mewakili ikon “github”.
2. Baca atribut “title”-nya dengan metode getAttribute().
3. Konfirmasikan nilai tersebut terhadap teks tooltip yang diharapkan.

Selenium 4 tip: Lebih suka getDomAttribute("title") untuk atribut HTML literal, dan biarkan Selenium Manajer menyelesaikan masalah driver alih-alih melakukan pengkodean secara langsung. chromedriver.exe.

Skenario 2: Plugin jQuery

Banyak plugin jQuery menerapkan tooltip, dan masing-masing menampilkan tooltip dengan sedikit berbeda.

Beberapa plugin mempertahankan markup tooltip di samping elemen pemicu setiap saat, sementara yang lain membuat tag "div" secara dinamis ketika kursor memasuki pemicu.

Untuk demonstrasi ini, kami menggunakan gaya “jQuery Tools Tooltip”.

Open https://demo.guru99.com/test/tooltip.htmlSaat mengarahkan kursor ke “Unduh sekarang”, akan muncul tooltip lanjutan dengan gambar, latar belakang keterangan, tabel kecil, dan tautan yang dapat diklik.

Jika Anda memeriksa kode sumbernya, div yang mewakili tooltip sudah berada di sebelah tautan “Unduh sekarang”. Tag skrip di bawahnya mengontrol kapan tooltip tersebut muncul.

Sekarang kita verifikasi teks tautan yang ditampilkan di dalam tooltip.

Pertama, temukan WebElement untuk “Unduh sekarang”. Gunakan API Interaksi untuk berpindah ke elemen tersebut (arahkan kursor mouse). Selanjutnya, temukan WebElement yang sesuai dengan tautan di dalam tooltip yang ditampilkan dan verifikasi teksnya dengan nilai yang diharapkan.

Ini kodenya:

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 Penjelasan:

1. Temukan WebElement yang sesuai dengan elemen “Unduh sekarang” yang akan Anda arahkan kursor mouse-nya.
2. Gunakan API Interaksi untuk mengarahkan kursor ke “Unduh sekarang”.
3. Setelah tooltip terlihat, temukan WebElement yang mewakili tautan di dalam tooltip (tag “a”).
4. Baca teks tooltip dengan getText() dan membandingkannya dengan nilai yang diharapkan yang tersimpan di expectedTooltip.

Pertanyaan Umum Demo Slot