Caranya Klik Gambar di Selenium Driver web

⚡ Ringkasan Cerdas

Klik pada Gambar di Selenium WebDriver memerlukan strategi pemilih CSS atau XPath karena elemen gambar tidak menampilkan teks tautan. Artikel ini menjelaskan cara menemukan gambar, memicu aksi klik, dan memverifikasi bahwa navigasi berhasil.

️ Tindakan Inti: Gunakan driver.findElement(By.cssSelector(…)).click() untuk melakukan klik pada elemen gambar apa pun yang ditampilkan di dalam tautan.
🎯 Pilihan Lokasi: By.linkText dan By.partialLinkText tidak berfungsi untuk gambar, jadi By.cssSelector atau By.xpath diperlukan.
🧪 Langkah Verifikasi: Konfirmasikan klik yang berhasil dengan membandingkan judul halaman baru menggunakan driver.getTitle() dengan string tujuan yang diharapkan.
🤖 Bantuan AI: Plugin AI modern menyarankan pemilih CSS yang stabil dan locator yang secara otomatis memperbaiki dirinya sendiri ketika markup aplikasi atau nilai atribut berubah.
️ Kesalahan Umum: Gambar yang tersembunyi, dimuat secara bertahap (lazy-loaded), atau tumpang tindih seringkali memerlukan penantian eksplisit, pengguliran agar terlihat, atau JavaKlik skrip untuk mendaftar dengan benar.

Baca Selengkapnya

Mengklik gambar di Selenium WebDriver adalah tugas umum ketika ikon, logo, atau gambar mini berfungsi sebagai tautan navigasi. Karena gambar tidak membawa teks yang terlihat, pencari teks tautan tradisional gagal dan strategi pemilih yang lebih andal diperlukan.

Mengakses Tautan Gambar

Tautan gambar adalah jangkar pada halaman web yang diwakili oleh sebuah gambar yang, ketika diklik, akan mengarahkan browser ke jendela atau halaman lain.

Karena berupa gambar, kita tidak dapat menggunakan metode By.linkText() dan By.partialLinkText() karena tautan gambar tidak memiliki teks tautan sama sekali.

Dalam hal ini, kita sebaiknya menggunakan By.cssSelector atau By.xpath. Metode pertama umumnya lebih disukai karena kesederhanaan dan keterbacaannya.

Pada contoh di bawah ini, kita akan mengakses logo “Facebook” di bagian kiri atas halaman Pemulihan Kata Sandi Facebook.

Kita akan menggunakan By.cssSelector dan atribut “title” elemen tersebut untuk mengakses tautan gambar. Kemudian kita akan memverifikasi bahwa browser telah diarahkan ke halaman beranda Facebook.

Java Code Example

Berikut ini Selenium Cuplikan WebDriver meluncurkan Chrome, membuka halaman pemulihan kata sandi Facebook, mengklik gambar logo Facebook, dan menampilkan judul halaman yang dihasilkan.

package newproject;
import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;

public class MyClass {

    public static void main(String[] args) {
        String baseUrl = "https://www.facebook.com/login/identify?ctx=recover";
        System.setProperty("webdriver.chrome.driver", "G:\\chromedriver.exe");
        WebDriver driver = new ChromeDriver();

        driver.get(baseUrl);
        // click on the "Facebook" logo on the upper left portion
        driver.findElement(By.cssSelector("a[title=\"Go to Facebook home\"]")).click();

        // verify that we are now back on Facebook's homepage
        if (driver.getTitle().equals("Facebook - log in or sign up")) {
            System.out.println("We are back at Facebook's homepage");
        } else {
            System.out.println("We are NOT in Facebook's homepage");
        }
        driver.close();
    }
}

Hasil

Praktik Terbaik untuk Mengambil Gambar

Beberapa kebiasaan dapat membuat otomatisasi klik gambar lebih andal di berbagai browser dan ukuran layar.

Lebih baik gunakan atribut yang stabil seperti title, alt, aria-label, atau data-* daripada jalur CSS yang bersarang terlalu dalam.
Tambahkan WebDriverWait secara eksplisit untuk ElementToBeClickable sebelum melakukan klik.
Untuk gambar yang dimuat secara bertahap (lazy-loaded images), gulir elemen tersebut agar terlihat dengan JavascriptPelaksana terlebih dahulu.
Jika lapisan transparan menghalangi klik, kembali ke metode lain. JavaKlik skrip pada elemen yang mendasarinya.
Validasi navigasi dengan driver.getTitle() atau elemen unik pada halaman tujuan.

Bagaimana AI Meningkatkan Strategi Pencarian Gambar

Alat pengujian berbantuan AI seperti TestimMabl dan Healenium menganalisis DOM di sekitar gambar dan mengusulkan locator yang dapat memperbaiki diri sendiri. Ketika nama kelas atau atribut berubah setelah rilis, kerangka kerja secara otomatis mengganti dengan alternatif yang paling stabil, yang mengurangi kegagalan yang tidak menentu pada navigasi berbasis ikon.

Para insinyur juga dapat menggunakan ChatGPT atau GitHub Copilot untuk menghasilkan cuplikan WebDriver, menyarankan ekspresi CSS atau XPath yang kuat untuk sebuah gambar, dan menyusun pernyataan untuk halaman yang dimuat setelah diklik. Kode yang dihasilkan tetap harus ditinjau kebenarannya dan penanganan penundaan dan overlay.

Kesimpulan

Mengklik tautan gambar di Selenium WebDriver mudah digunakan setelah Anda memilih locator yang stabil. By.cssSelector dengan atribut title atau alt adalah pendekatan yang paling mudah dibaca, By.xpath adalah pilihan cadangan ketika markupnya kurang tepat, dan penundaan eksplisit membuat skrip dapat diandalkan di berbagai eksekusi.

Pertanyaan Umum Demo Slot

Temukan gambar dengan By.cssSelector atau By.xpath menggunakan atribut tetap seperti title, alt, atau aria-label, lalu panggil .click() pada WebElement yang dikembalikan. Verifikasi hasilnya dengan driver.getTitle() atau elemen unik pada halaman tujuan.

Ya. Alat-alat seperti TestimMabl dan ChatGPT memeriksa DOM di sekitarnya dan menyarankan selektor yang stabil berdasarkan atribut title, alt, aria-label, atau data. Para insinyur tetap harus meninjau locator yang dihasilkan untuk memastikan keunikan dan ketahanannya.

Locator yang dapat memperbaiki diri sendiri adalah fitur AI yang mengganti selector asli dengan yang lain ketika selector asli gagal. Framework seperti Healenium dan Mabl mengamati perubahan atribut di sekitar gambar dan memilih pengganti yang paling stabil, yang mengurangi pengujian yang tidak stabil setelah pembaruan UI.

Kedua locator tersebut cocok berdasarkan teks yang terlihat di dalam sebuah anchor. Tautan gambar membungkus tag img dan tidak mengekspos node teks apa pun, sehingga pencocokan selalu mengembalikan hasil kosong. Gunakan By.cssSelector atau By.xpath dengan title, alt, atau aria-label sebagai gantinya.

Jika overlay, modal, atau tooltip menghalangi gambar, gulir gambar agar terlihat dengan JavascriptEksekutor dan tambahkan WebDriverWait untuk ElementToBeClickable. Sebagai alternatif, jalankan JavaKlik skrip pada WebElement untuk melewati tumpang tindih.ping lapisan.

Konfirmasikan judul halaman baru dengan driver.getTitle(), yang saat ini URL dengan driver.getCurrentUrl(), atau keberadaan elemen unik pada halaman tujuan. Kombinasi dari pemeriksaan ini memberikan kepercayaan pada pengujian bahwa klik tersebut benar-benar memicu navigasi.