Cara Menangani iFrames di Selenium Webdriver: switchTo ()

Daftar Isi:

Anonim

iFrame di Selenium Webdriver

iFrame di Selenium Webdriver adalah halaman web atau bingkai inline yang tertanam di halaman web lain atau dokumen HTML yang tertanam di dalam dokumen HTML lain. Iframe sering digunakan untuk menambahkan konten dari sumber lain seperti iklan ke halaman web. Iframe ditentukan dengan tag < iframe >.

Dalam tutorial ini, Anda akan belajar -

  1. Cara mengidentifikasi iframe:
  2. Bagaimana cara beralih elemen di iframes menggunakan perintah Web Driver:
  3. Konsep Bingkai Bersarang (Bingkai di Dalam Bingkai):

Cara mengidentifikasi iframe:

Kami tidak dapat mendeteksi frame hanya dengan melihat halaman atau dengan memeriksa Firebug.

Perhatikan gambar di bawah ini, Iklan yang ditampilkan adalah Iframe, kita tidak dapat menemukan atau mengenali itu hanya dengan memeriksa menggunakan Firebug. Jadi pertanyaannya adalah bagaimana Anda bisa mengidentifikasi iframe?

Cara mengidentifikasi iframe menggunakan Selenium WebDriver

Kami dapat mengidentifikasi bingkai di Selenium menggunakan metode yang diberikan di bawah ini:

  • Klik kanan pada elemen, Jika Anda menemukan opsi seperti 'Bingkai Ini' maka itu adalah iframe. (Lihat diagram di atas)
  • Klik kanan pada halaman dan klik 'Lihat Sumber Halaman' dan Cari dengan 'iframe', jika Anda dapat menemukan nama tag dengan 'iframe' maka artinya halaman tersebut berisi iframe.

Pada diagram di atas, Anda dapat melihat bahwa opsi ' Bingkai Ini ' tersedia dengan mengklik kanan, jadi kami sekarang yakin bahwa ini adalah iframe.

Kami bahkan dapat mengidentifikasi jumlah total iframe dengan menggunakan cuplikan di bawah ini.

Int size = driver.findElements (By.tagName ("iframe")). Size ();

Cara mengganti elemen di iframe menggunakan perintah Web Driver:

Pada dasarnya, kita dapat mengganti elemen dan menangani bingkai di Selenium menggunakan 3 cara.

  • Berdasarkan Indeks
  • Berdasarkan Nama atau Id
  • Oleh Elemen Web

Beralih ke bingkai demi indeks:

Indeks adalah salah satu atribut untuk penanganan bingkai di Selenium yang dapat kita gunakan untuk beralih ke sana.

Indeks iframe dimulai dengan '0'.

Misalkan jika ada 100 frame di halaman, kita bisa beralih ke frame di Selenium dengan menggunakan index.

  • driver.switchTo (). frame (0);
  • driver.switchTo (). frame (1);

Beralih ke bingkai berdasarkan Nama atau ID:

Nama dan ID adalah atribut untuk menangani frame di Selenium tempat kita dapat beralih ke iframe.

  • driver.switchTo (). frame ("iframe1");
  • driver.switchTo (). frame ("id elemen");

Contoh Beralih ke iframe melalui ID:

Mari kita ambil contoh untuk mengganti bingkai di Selenium yang ditampilkan pada gambar di bawah ini. Persyaratan kami adalah mengklik iframe.

Kita dapat mengakses iframe ini melalui URL di bawah ini: http: //demo.guru99.com/test/guru99home/

Tidak mungkin untuk mengklik iframe secara langsung melalui XPath karena ini adalah iframe. Pertama kita harus beralih ke frame dan kemudian kita dapat mengklik menggunakan xpath.

Langkah 1)

Driver WebDriver = FirefoxDriver baru ();driver.get ("http://demo.guru99.com/test/guru99home/");driver.manage (). window (). maksimalkan ();
  • Kami menginisialisasi driver Firefox.
  • Arahkan ke situs "guru99" yang terdiri dari iframe.
  • Memperbesar jendela.

Langkah 2)

driver.switchTo (). frame ("a077aa5e");
  • Pada langkah ini kita perlu mencari tahu id iframe dengan memeriksa melalui Firebug.
  • Kemudian beralih ke iframe melalui ID.

Langkah 3)

driver.findElement (By.xpath ("html / body / a / img")). click ();
  • Di sini kita perlu menemukan xpath dari elemen yang akan diklik.
  • Klik elemen menggunakan perintah driver web yang ditunjukkan di atas.

Berikut kode lengkapnya:

kelas publik SwitchToFrame_ID {public static void main (String [] args) {Driver WebDriver = FirefoxDriver baru (); // menavigasi ke Perambandriver.get ("http://demo.guru99.com/test/guru99home/");// membuka halaman yang berisi iframedriver.manage (). window (). maksimalkan ();driver.switchTo (). frame ("a077aa5e"); // mengganti frame dengan IDSystem.out.println ("******** Kami beralih ke iframe *******");driver.findElement (By.xpath ("html / body / a / img")). click ();// Mengklik iframeSystem.out.println ("********* Kami selesai ***************");}}

Keluaran:

Browser menavigasi ke halaman yang terdiri dari iframe di atas dan mengklik iframe.

Beralih ke bingkai dengan Elemen Web:

Kami bahkan dapat beralih ke iframe menggunakan elemen web.

  • driver.switchTo (). frame (WebElement);

Cara beralih kembali ke Bingkai Utama

Kami harus keluar dari iframe.

Untuk kembali ke bingkai induk, Anda dapat menggunakan switchTo (). ParentFrame () atau jika Anda ingin kembali ke bingkai utama (atau sebagian besar induk), Anda dapat menggunakan switchTo (). DefaultContent ();

driver.switchTo (). parentFrame ();driver.switchTo (). defaultContent ();

Bagaimana cara beralih frame, jika kita TIDAK DAPAT beralih menggunakan ID atau Elemen Web:

Misalkan jika ada 100 bingkai di halaman, dan tidak ada ID yang tersedia, dalam hal ini, kita tidak tahu dari mana elemen yang dibutuhkan iframe dimuat (Ini adalah kasus ketika kita tidak tahu indeks bingkai juga).

Solusi untuk masalah di atas adalah, kita harus menemukan indeks iframe tempat elemen dimuat dan kemudian kita perlu beralih ke iframe melalui indeks.

Di bawah ini adalah langkah-langkah untuk menemukan indeks Frame yang digunakan untuk memuat elemen dengan menggunakan potongan di bawah ini

Langkah 1)

Driver WebDriver = FirefoxDriver baru ();driver.get ("http://demo.guru99.com/test/guru99home/");driver.manage (). window (). maksimalkan ();
  • Inisialisasi driver Firefox.
  • Arahkan ke situs "guru99" yang terdiri dari iframe.
  • Memperbesar jendela.

Langkah 2)

int size = driver.findElements (By.tagName ("iframe")). size ();
  • Kode di atas menemukan jumlah total iframe yang ada di dalam halaman menggunakan tagname 'iframe'.

Langkah 3)

Tujuan dari langkah ini adalah mengetahui indeks iframe.

untuk (int i = 0; i <= size; i ++) {driver.switchTo (). frame (i);int total = driver.findElements (By.xpath ("html / body / a / img")). size ();System.out.println (total);driver.switchTo (). defaultContent ();}

Di atas "forloop" mengulang semua iframe di halaman dan mencetak '1' jika iframe yang kami butuhkan ditemukan, selain itu mengembalikan '0'.

Berikut kode lengkap hingga langkah 3:

public class IndexOfIframe {public static void main (String [] args) {Driver WebDriver = FirefoxDriver baru ();driver.get ("http://demo.guru99.com/test/guru99home/");driver.manage (). window (). maksimalkan ();//driver.manage().timeouts().implicitlyWait(100, TimeUnit.SECONDS);int size = driver.findElements (By.tagName ("iframe")). size ();untuk (int i = 0; i <= size; i ++) {driver.switchTo (). frame (i);int total = driver.findElements (By.xpath ("html / body / a / img")). size ();System.out.println (total);driver.switchTo (). defaultContent ();}}}

Jalankan program ini dan hasilnya akan seperti di bawah ini:

Keluaran:

100000
Verifikasi output, Anda dapat menemukan rangkaian 0 dan 1.
  • Di mana pun Anda menemukan '1' dalam output, itulah indeks Frame yang digunakan untuk memuat elemen.
  • Karena indeks iframe dimulai dengan '0' jika Anda menemukan 1 di 1 st tempat, maka indeks adalah 0.
  • Jika Anda menemukan 1 dari 3 rd tempat, indeks adalah 2.
Kita dapat mengomentari perulangan for, setelah kita menemukan index. Langkah 4) 
driver.switchTo (). frame (0);
  • Setelah Anda menemukan indeks elemen, Anda dapat beralih frame menggunakan perintah di atas.
  • driver.switchTo (). frame (indeks ditemukan dari Langkah 3);
Langkah 5) 
driver.findElement (By.xpath ("html / body / a / img")). click ();
  • Kode di atas akan mengklik iframe atau elemen di iframe.
Jadi kode lengkapnya akan seperti di bawah ini: 
kelas publik SwitchToframe {public static void main (String [] args) melempar NoSuchElementException {Driver WebDriver = FirefoxDriver baru ();driver.get ("http://demo.guru99.com/test/guru99home/");driver.manage (). window (). maksimalkan ();// int size = driver.findElements (By.tagName ("iframe")). size ();/ * untuk (int i = 0; i <= size; i ++) {driver.switchTo (). frame (i);int total = driver.findElements (By.xpath ("html / body / a / img")). size ();System.out.println (total);driver.switchTo (). defaultContent (); // beralih kembali dari iframe} * /// Mengomentari kode untuk menemukan indeks elemendriver.switchTo (). frame (0); // Beralih ke bingkaiSystem.out.println ("******** Kita dialihkan ke iframe *******");driver.findElement (By.xpath ("html / body / a / img")). click ();// Mengklik elemen sesuai dengan IklanSystem.out.println ("********* Kami selesai ***************");}}
Output: Browser menavigasi ke halaman yang terdiri dari iframe di atas dan mengklik iframe.

Konsep Bingkai Bersarang (Bingkai di Dalam Bingkai):

Mari kita asumsikan bahwa ada dua bingkai satu di dalam yang lain seperti yang ditunjukkan pada gambar di bawah ini dan persyaratan kami adalah mencetak teks di bingkai luar dan bingkai dalam. Dalam kasus bingkai bersarang,
  • Pertama-tama kita harus beralih ke bingkai luar baik dengan Indeks atau ID iframe
  • Setelah kami beralih ke bingkai luar, kami dapat menemukan jumlah total iframe di dalam bingkai luar, dan
  • Kita dapat beralih ke bingkai dalam dengan salah satu metode yang diketahui.
Saat keluar dari bingkai, kita harus keluar dalam urutan yang sama seperti saat kita masuk ke dalamnya dari bingkai dalam terlebih dahulu dan kemudian bingkai luar.
IFrames bersarang di Selenium WebDriver

Kode Html untuk frame bersarang di atas adalah seperti yang ditunjukkan di bawah ini.

Kode HTML di atas menjelaskan dengan jelas tag iframe (disorot dengan warna hijau) di dalam tag iframe lain, yang menunjukkan adanya iframe bertingkat.

Berikut adalah langkah-langkah untuk beralih ke bingkai luar dan mencetak teks pada bingkai luar: Langkah 1)

Driver WebDriver = FirefoxDriver baru ();driver.get ("Url");driver.manage (). window (). maksimalkan ();driver.manage (). timeout (). implicitlyWait (2, TimeUnit.SECONDS);int size = driver.findElements (By.tagName ("iframe")). size ();System.out.println ("Bingkai Total -" + ukuran);// mencetak jumlah total framedriver.switchTo (). frame (0); // Mengganti Bingkai LuarSystem.out.println (driver.findElement (By.xpath ("xpath elemen luar")). GetText ());
  • Beralih ke Bingkai luar.
  • Mencetak teks di bingkai luar.

Setelah kita beralih ke bingkai luar, kita harus tahu apakah ada bingkai dalam di dalam bingkai luar

Langkah 2)

size = driver.findElements (By.tagName ("iframe")). size ();// mencetak jumlah total bingkai di dalam bingkai luarSystem.out.println ("Bingkai Total -" + ukuran);
  • Menemukan jumlah total iframe di dalam bingkai luar.
  • Jika ukuran ditemukan '0' maka tidak ada bingkai dalam di dalam bingkai.
Langkah 3) 
driver.switchTo (). frame (0); // Beralih ke bingkai dalamSystem.out.println (driver.findElement (By.xpath ("jalur x dari elemen dalam")). GetText ());
  • Beralih ke rangka dalam
  • Mencetak teks di bingkai bagian dalam.
Berikut kode lengkapnya: 
public class FramesInsideFrames {public static void main (String [] args) {Driver WebDriver = FirefoxDriver baru ();driver.get ("Url");driver.manage (). window (). maksimalkan ();driver.manage (). timeout (). implicitlyWait (2, TimeUnit.SECONDS);int size = driver.findElements (By.tagName ("iframe")). size ();System.out.println ("Bingkai Total -" + ukuran);// mencetak jumlah total framedriver.switchTo (). frame (0); // Mengganti Bingkai LuarSystem.out.println (driver.findElement (By.xpath ("xpath elemen luar")). GetText ());// Mencetak teks di bingkai luarsize = driver.findElements (By.tagName ("iframe")). size ();// mencetak jumlah total bingkai di dalam bingkai luarSystem.out.println ("Bingkai Total -" + ukuran);driver.switchTo (). frame (0); // Beralih ke bingkai dalamSystem.out.println (driver.findElement (By.xpath ("jalur x dari elemen dalam")). GetText ());// Mencetak teks dalam bingkai dalamdriver.switchTo (). defaultContent ();}}
Output : Output dari kode di atas akan mencetak teks di bingkai dalam dan bingkai luar.