Tooltip di Selenium
Sebuah Tooltip di Selenium adalah teks yang muncul ketika melayang mouse obyek pada halaman web. Objek dapat berupa link, gambar, tombol, area teks, dll. Teks tooltip sering memberikan lebih banyak informasi tentang objek yang di atasnya pengguna mengarahkan kursor mouse.
Tooltip secara tradisional diimplementasikan sebagai atribut 'title' ke sebuah elemen. Nilai atribut ini ditampilkan sebagai keterangan alat saat mengarahkan mouse. Ini adalah teks statis yang memberikan informasi tentang elemen tanpa gaya.
Sekarang, ada banyak plugin yang tersedia untuk implementasi 'tip alat'. Tooltip tingkat lanjut dengan gaya, rendering, gambar, dan tautan diimplementasikan menggunakan plugin JavaScript / JQuery atau menggunakan CSS Tooltips.
- Untuk mengakses atau memverifikasi tooltips statis yang diimplementasikan menggunakan atribut HTML "title", kita cukup menggunakan metode getAttribute ("title") dari WebElement. Nilai yang dikembalikan dari metode ini (yang merupakan teks tooltip) dibandingkan dengan nilai yang diharapkan untuk verifikasi.
- Untuk bentuk implementasi tooltip lainnya, kita harus menggunakan "API Interaksi Pengguna Tingkat Lanjut" yang disediakan oleh Driver Web untuk membuat efek hover mouse dan kemudian mengambil tooltip untuk elemen tersebut.
Ringkasan API Interaksi Pengguna Tingkat Lanjut:
API Interaksi Pengguna Tingkat Lanjut menyediakan API untuk tindakan pengguna seperti seret dan lepas, hovering, banyak pilihan, tekan dan lepaskan tombol, dan tindakan lainnya menggunakan keyboard atau mouse di halaman web.
Anda dapat merujuk tautan ini untuk detail lebih lanjut tentang API.
https://seleniumhq.github.io/selenium/docs/api/java/index.html?org/openqa/selenium/interactions/Actions.html
Di sini, mari kita lihat bagaimana menggunakan beberapa kelas dan metode yang kita perlukan untuk memindahkan elemen slider dengan offset.
Langkah 1) Untuk menggunakan API, paket / kelas berikut perlu diimpor:
Langkah 2) Buat objek kelas "Tindakan" dan buat Urutan tindakan pengguna. Kelas tindakan digunakan untuk membangun urutan tindakan pengguna seperti moveToElement (), dragAndDrop () dll. Berbagai metode yang terkait dengan tindakan pengguna disediakan oleh API.
Objek driver disediakan sebagai parameter untuk konstruktornya.
Langkah 3) Buat Objek Tindakan menggunakan metode build () dari kelas "Tindakan". Panggil metode perform () untuk menjalankan semua tindakan yang dibuat oleh objek Actions (pembangun di sini).
Kami telah melihat cara menggunakan beberapa metode Tindakan pengguna yang disediakan oleh API - clickAndHold (elemen), moveByOffset (10,0), release (). API menyediakan banyak metode seperti itu.
Lihat tautan untuk lebih jelasnya.
Cara mendapatkan Teks Tooltip di Selenium Webdriver
Mari kita lihat demonstrasi dalam mengakses dan memverifikasi tip alat dalam skenario sederhana
- Skenario 1: Keterangan alat diterapkan menggunakan atribut "judul"
- Skenario 2: Tooltip diimplementasikan menggunakan plugin jQuery.
Skenario 1: Atribut 'judul' HTML
Untuk kasus ini, mari kita ambil contoh situs - http://demo.guru99.com/test/social-icon.html.
Kami akan mencoba untuk memverifikasi tooltip dari ikon "github" di kanan atas halaman.
Untuk melakukannya, pertama-tama kita akan menemukan elemen tersebut dan mendapatkan atribut 'title' [judul] dan memverifikasi dengan teks tip alat yang diharapkan.
Karena, kita mengasumsikan tool tip berada dalam atribut "title", kita bahkan tidak mengotomatiskan efek hover mouse tetapi hanya mengambil nilai atribut menggunakan metode "getAttribute ()".
Ini kodenya
import org.openqa.selenium.By;import org.openqa.selenium.WebDriver;impor org.openqa.selenium.chrome.ChromeDriver;import org.openqa.selenium. *;public class ToolTip {public static void main (String [] args) {String baseUrl = "http://demo.guru99.com/test/social-icon.html";System.setProperty ("webdriver.chrome.driver", "G: \\ chromedriver.exe");Driver WebDriver = new ChromeDriver ();driver.get (baseUrl);String expectedTooltip = "Github";// Temukan ikon Github di kanan atas headerWebElement github = driver.findElement (By.xpath (".//*[@ class = 'soc-ico show-round'] / a [4]"));// dapatkan nilai atribut "title" dari ikon githubString actualTooltip = github.getAttribute ("title");// Tegaskan nilai tooltip seperti yang diharapkanSystem.out.println ("Judul Sebenarnya dari Tool Tip" + actualTooltip);if (actualTooltip.equals (expectedTooltip)) {System.out.println ("Kasus Uji Lulus");}driver.close ();}}
Penjelasan kode
- Temukan WebElement yang mewakili ikon "github".
- Dapatkan atribut "title" -nya menggunakan metode getAttribute ().
- Menegaskan nilai terhadap nilai tooltip yang diharapkan.
Skenario 2: Plugin JQuery:
Ada banyak plugin JQuery yang tersedia untuk mengimplementasikan tooltips, dan masing-masing memiliki bentuk implementasi yang sedikit berbeda.
Beberapa plugin mengharapkan HTML tooltip selalu ada di samping elemen yang tooltipnya berlaku sedangkan yang lain membuat tag "div" dinamis, yang muncul dengan cepat saat mengarahkan kursor ke elemen.
Untuk demonstrasi kami, mari pertimbangkan cara "jQuery Tools Tooltip" untuk implementasi tooltip.
Di sini, di URL - http://demo.guru99.com/test/tooltip.html Anda dapat melihat demo di mana mouse mengarahkan kursor ke "Unduh sekarang", kami mendapatkan tooltip lanjutan dengan gambar, latar belakang info, tabel dan tautan di dalamnya yang dapat diklik.
Jika Anda melihat sumber di bawah ini, Anda dapat melihat bahwa tag div yang mewakili tooltip selalu ada di sebelah tag tautan "Unduh sekarang". Namun, kode di dalam tag skrip di bawah ini mengontrol kapan harus muncul.
Mari kita coba untuk memverifikasi hanya teks link di tooltip untuk demonstrasi kita di sini.
Pertama-tama kami akan menemukan WebElement yang sesuai dengan "Unduh sekarang". Kemudian menggunakan Interactions API, kita akan pindah ke elemen (mouse-hover). Selanjutnya, kita akan menemukan WebElement yang sesuai dengan tautan di dalam tooltip yang ditampilkan dan memverifikasinya dengan teks yang diharapkan.
Ini kodenya
impor org.openqa.selenium.interactions.Action;impor org.openqa.selenium.interactions.Actions;import org.openqa.selenium.By;import org.openqa.selenium.WebDriver;impor org.openqa.selenium.chrome.ChromeDriver;import org.openqa.selenium. *;public class JqueryToolTip {public static void main (String [] args) {String baseUrl = "http://demo.guru99.com/test/tooltip.html";System.setProperty ("webdriver.chrome.driver", "G: \\ chromedriver.exe");Driver WebDriver = new ChromeDriver ();String expectedTooltip = "Apa yang baru di 3.2";driver.get (baseUrl);WebElement download = driver.findElement (By.xpath (".//*[@ id = 'download_now']"));Tindakan pembangun = Tindakan baru (driver);builder.clickAndHold (). moveToElement (unduh);builder.moveToElement (download) .build (). perform ();WebElement toolTipElement = driver.findElement (By.xpath (".//*[@ class = 'box'] / div / a"));String actualTooltip = toolTipElement.getText ();System.out.println ("Judul Sebenarnya dari Tool Tip" + actualTooltip);if (actualTooltip.equals (expectedTooltip)) {System.out.println ("Kasus Uji Lulus");}driver.close ();}}
Penjelasan Kode
- Temukan WebElement yang sesuai dengan elemen "unduh sekarang" yang akan kita arahkan mouse.
- Menggunakan API Interaksi, arahkan mouse ke "Unduh sekarang".
- Dengan asumsi tooltip ditampilkan, temukan WebElement yang sesuai dengan link di dalam tooltip yaitu tag "a".
- Verifikasi teks tooltip tautan yang diambil menggunakan getText () terhadap nilai yang diharapkan yang telah kita simpan di "expectedToolTip"
Ringkasan:
Dalam tutorial ini, Anda telah mempelajari cara mengakses Tooltips menggunakan driver Web Selenium.
- Alat Kiat diterapkan dengan berbagai cara -
- Penerapan dasar didasarkan pada atribut "judul" HTML. getAttribute (title) mendapatkan nilai tooltip.
- Implementasi tool tip lainnya seperti JQuery, tooltips CSS membutuhkan Interactions API untuk membuat efek mouse hover
- API Interaksi Pengguna Tingkat Lanjut
- moveToElement (elemen) dari kelas Tindakan digunakan untuk mengarahkan mouse ke sebuah elemen.
- Metode build () dari kelas Actions membangun urutan tindakan pengguna ke dalam objek Action.
- Perform () dari kelas Tindakan mengeksekusi semua urutan tindakan pengguna sekaligus.
- Untuk memverifikasi tooltip, pertama-tama kita harus mengarahkan mouse ke elemen tersebut, kemudian menemukan elemen yang sesuai dengan tool tip dan mendapatkan teks atau nilai lainnya untuk memverifikasi nilai yang diharapkan.