Jak obsługiwać iFrame w Selenium Webdriver: switchTo ()

Spisie treści:

Anonim

iFrame w Selenium Webdriver

iFrame w Selenium Webdriver to strona internetowa lub ramka wbudowana, która jest osadzona na innej stronie internetowej lub dokumencie HTML osadzonym w innym dokumencie HTML. Element iframe jest często używany do dodawania treści z innych źródeł, takich jak reklama, do strony internetowej. Element iframe jest definiowany za pomocą tagu < iframe >.

W tym samouczku nauczysz się -

  1. Jak rozpoznać element iframe:
  2. Jak przełączać elementy w elementach iframe za pomocą poleceń sterownika internetowego:
  3. Koncepcja zagnieżdżonych ramek (ramki wewnątrz ramek):

Jak rozpoznać element iframe:

Nie możemy wykryć ramek, po prostu wyświetlając stronę lub sprawdzając Firebug.

Przyjrzyj się poniższemu obrazowi. Wyświetlana reklama jest ramką iframe, której nie możemy zlokalizować ani rozpoznać, po prostu sprawdzając za pomocą Firebug. Pytanie brzmi, jak zidentyfikować iframe?

Jak zidentyfikować ramkę iframe za pomocą Selenium WebDriver

Możemy zidentyfikować ramki w Selenium za pomocą poniższych metod:

  • Kliknij element prawym przyciskiem myszy, jeśli znajdziesz opcję, taką jak „Ta ramka”, jest to ramka iframe (patrz powyższy diagram).
  • Kliknij stronę prawym przyciskiem myszy i kliknij „Wyświetl źródło strony” i wyszukaj „iframe”. Jeśli możesz znaleźć jakąkolwiek nazwę tagu z „iframe”, oznacza to, że strona składa się z iframe.

Na powyższym schemacie widać, że opcja „ Ta ramka ” jest dostępna po kliknięciu prawym przyciskiem myszy, więc teraz jesteśmy pewni, że jest to ramka iframe.

Możemy nawet zidentyfikować całkowitą liczbę ramek iframe, korzystając z poniższego fragmentu.

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

Jak przełączać elementy w elementach iframe za pomocą poleceń sterownika internetowego:

Zasadniczo możemy przełączać elementy i obsługiwać ramki w Selenium na 3 sposoby.

  • Według indeksu
  • Według nazwy lub identyfikatora
  • Według elementu sieci Web

Przełącz do klatki według indeksu:

Indeks to jeden z atrybutów obsługi ramek w Selenium, przez który możemy się do niego przełączyć.

Indeks elementu iframe zaczyna się od „0”.

Załóżmy, że jeśli na stronie jest 100 ramek, możemy przełączyć się na ramkę w Selenium za pomocą indeksu.

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

Przełącz się na ramkę według nazwy lub identyfikatora:

Nazwa i identyfikator to atrybuty do obsługi ramek w Selenium, za pomocą których możemy przełączyć się na iframe.

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

Przykład przełączania się na iframe za pomocą identyfikatora:

Weźmy przykład przełączania ramki w Selenium wyświetlanej na poniższym obrazku. Naszym wymaganiem jest kliknięcie elementu iframe.

Możemy uzyskać dostęp do tej ramki iframe za pośrednictwem poniższego adresu URL: http: //demo.guru99.com/test/guru99home/

Niemożliwe jest kliknięcie elementu iframe bezpośrednio w XPath, ponieważ jest to element iframe. Najpierw musimy przełączyć się na ramkę, a następnie możemy kliknąć używając xpath.

Krok 1)

Sterownik WebDriver = nowy FirefoxDriver ();driver.get („http://demo.guru99.com/test/guru99home/”);driver.manage (). window (). maximize ();
  • Inicjalizujemy sterownik Firefox.
  • Przejdź do witryny „guru99”, która zawiera element iframe.
  • Zmaksymalizowano okno.

Krok 2)

driver.switchTo (). frame ("a077aa5e");
  • Na tym etapie musimy znaleźć identyfikator elementu iframe, sprawdzając za pomocą narzędzia Firebug.
  • Następnie przejdź do elementu iframe za pomocą identyfikatora.

Krok 3)

driver.findElement (By.xpath ("html / body / a / img")). click ();
  • Tutaj musimy znaleźć ścieżkę x elementu, który ma zostać kliknięty.
  • Kliknij element za pomocą polecenia sterownika sieciowego pokazanego powyżej.

Oto pełny kod:

public class SwitchToFrame_ID {public static void main (String [] args) {Sterownik WebDriver = nowy FirefoxDriver (); // przechodzi do przeglądarkidriver.get („http://demo.guru99.com/test/guru99home/”);// przechodzi do strony zawierającej ramkę iframedriver.manage (). window (). maximize ();driver.switchTo (). frame ("a077aa5e"); // przełączanie ramki według IDSystem.out.println ("******** Jesteśmy przełączeni na iframe *******");driver.findElement (By.xpath ("html / body / a / img")). click ();// Klika element iframeSystem.out.println ("********* Skończyliśmy ***************");}}

Wynik:

Przeglądarka przechodzi do strony zawierającej powyższy element iframe i klika element iframe.

Przełącz się na ramkę za pomocą elementu internetowego:

Możemy nawet przełączyć się na iframe za pomocą elementu web.

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

Jak przełączyć się z powrotem do ramy głównej

Musimy wyjść z iframe.

Aby powrócić do ramki nadrzędnej, możesz użyć switchTo (). ParentFrame () lub, jeśli chcesz wrócić do ramki głównej (lub najbardziej nadrzędnej), możesz użyć switchTo (). DefaultContent ();

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

Jak przełączyć ramkę, jeśli NIE MOŻEMY przełączyć się za pomocą identyfikatora lub elementu sieci:

Załóżmy, że jeśli na stronie jest 100 ramek i nie ma dostępnego identyfikatora, w tym przypadku po prostu nie wiemy, z którego elementu iframe jest ładowany wymagany element (jest tak, gdy nie znamy indeksu ramki również).

Rozwiązanie powyższego problemu polega na tym, że musimy znaleźć indeks elementu iframe, przez który ładowany jest element, a następnie przejść do elementu iframe za pośrednictwem indeksu.

Poniżej znajdują się kroki, aby znaleźć indeks ramki, przez którą ładowany jest element, za pomocą poniższego fragmentu

Krok 1)

Sterownik WebDriver = nowy FirefoxDriver ();driver.get („http://demo.guru99.com/test/guru99home/”);driver.manage (). window (). maximize ();
  • Zainicjuj sterownik przeglądarki Firefox.
  • Przejdź do witryny „guru99” zawierającej element iframe.
  • Zmaksymalizowano okno.

Krok 2)

int size = driver.findElements (By.tagName ("iframe")). size ();
  • Powyższy kod znajduje całkowitą liczbę ramek iframe obecnych na stronie za pomocą zmiennej „iframe”.

Krok 3)

Celem tego kroku byłoby znalezienie indeksu elementu iframe.

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

Powyżej „forloop” wykonuje iterację wszystkich ramek iframe na stronie i wyświetla „1”, jeśli znaleziono wymaganą ramkę iframe, w przeciwnym razie zwraca „0”.

Oto pełny kod do kroku 3:

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

Uruchom ten program, a wynik będzie taki jak poniżej:

Wynik:

100000
Sprawdź dane wyjściowe, możesz znaleźć serie zer i jedynek.
  • Wszędzie tam, gdzie na wyjściu znajduje się „1”, jest to indeks ramki, przez który ładowany jest element.
  • Ponieważ indeks elementu iframe zaczyna się od „0”, jeśli znajdziesz 1 na pierwszym miejscu, to indeks wynosi 0.
  • Jeśli okaże się, 1 na 3 rd miejsce, indeks 2.
Po znalezieniu indeksu możemy zakomentować pętlę for. Krok 4)
driver.switchTo (). frame (0); 
  • Po znalezieniu indeksu elementu możesz przełączyć ramkę za pomocą powyższego polecenia.
  • driver.switchTo (). frame (indeks znaleziony w kroku 3);
Krok 5)
driver.findElement (By.xpath ("html / body / a / img")). click ();
  • Powyższy kod kliknie element iframe lub element w elemencie iframe.
Więc cały kod wyglądałby jak poniżej:
public class SwitchToframe {public static void main (String [] args) rzuca NoSuchElementException {Sterownik WebDriver = nowy FirefoxDriver ();driver.get („http://demo.guru99.com/test/guru99home/”);driver.manage (). window (). maximize ();// int size = driver.findElements (By.tagName ("iframe")). size ();/ * for (int i = 0; i <= size; i ++) {driver.switchTo (). frame (i);int total = driver.findElements (By.xpath ("html / body / a / img")). size ();System.out.println (łącznie);driver.switchTo (). defaultContent (); // przełączam się z powrotem z iframe} * /// Skomentowałem kod w celu znalezienia indeksu elementudriver.switchTo (). frame (0); // Przejście do ramkiSystem.out.println ("******** Jesteśmy przełączeni do iframe *******");driver.findElement (By.xpath ("html / body / a / img")). click ();// Kliknięcie elementu zgodnego z AdvertisementSystem.out.println ("********* Skończyliśmy ***************");}}
Wynik: przeglądarka przechodzi do strony zawierającej powyższy element iframe i klika element iframe.

Koncepcja zagnieżdżonych ramek (ramki wewnątrz ramek):

Załóżmy, że istnieją dwie ramki jedna w drugiej, jak pokazano na poniższym obrazku, a naszym wymaganiem jest wydrukowanie tekstu w ramce zewnętrznej i ramce wewnętrznej. W przypadku ramek zagnieżdżonych
  • Najpierw musimy przełączyć się na ramkę zewnętrzną za pomocą indeksu lub identyfikatora elementu iframe
  • Po przełączeniu się na ramkę zewnętrzną możemy znaleźć całkowitą liczbę ramek iframe wewnątrz ramki zewnętrznej i
  • Możemy przełączyć się na ramkę wewnętrzną dowolną ze znanych metod.
Wychodząc z ramki, musimy wyjść w tej samej kolejności, w jakiej do niej weszliśmy, najpierw z ramy wewnętrznej, a następnie zewnętrznej.
Zagnieżdżone iFrame w Selenium WebDriver

Kod HTML powyższej zagnieżdżonej ramki jest pokazany poniżej.

Powyższy kod HTML jasno wyjaśnia tag iframe (podświetlony na zielono) w innym tagu iframe, wskazując na obecność zagnieżdżonych elementów iframe.

Poniżej znajdują się instrukcje przełączania na ramkę zewnętrzną i drukowania tekstu w ramkach zewnętrznych: Krok 1)

Sterownik WebDriver = nowy FirefoxDriver ();driver.get ("Url");driver.manage (). window (). maximize ();driver.manage (). timeouts (). implicitlyWait (2, TimeUnit.SECONDS);int size = driver.findElements (By.tagName ("iframe")). size ();System.out.println ("Łączna liczba ramek -" + rozmiar);// wypisuje całkowitą liczbę klatekdriver.switchTo (). frame (0); // Przełączanie ramki zewnętrznejSystem.out.println (driver.findElement (By.xpath ("xpath elementu zewnętrznego")). GetText ()); 
  • Przełącz na ramę zewnętrzną.
  • Drukuje tekst na zewnętrznej ramce.

Po przejściu na ramkę zewnętrzną powinniśmy wiedzieć, czy jakakolwiek wewnętrzna ramka znajduje się wewnątrz ramki zewnętrznej

Krok 2)

size = driver.findElements (By.tagName ("iframe")). size ();// wypisuje całkowitą liczbę ramek wewnątrz ramki zewnętrznejSystem.out.println ("Łączna liczba ramek -" + rozmiar);
  • Znajduje łączną liczbę ramek iframe w zewnętrznej ramce.
  • Jeśli rozmiar został znaleziony jako „0”, to wewnątrz ramki nie ma wewnętrznej ramki.
Krok 3)
driver.switchTo (). frame (0); // Przełączanie na wewnętrzną ramkęSystem.out.println (driver.findElement (By.xpath ("xpath elementu wewnętrznego")). GetText ());
  • Przełącz na ramkę wewnętrzną
  • Drukuje tekst na wewnętrznej ramce.
Oto pełny kod:
public class FramesInsideFrames {public static void main (String [] args) {Sterownik WebDriver = nowy FirefoxDriver ();driver.get ("Url");driver.manage (). window (). maximize ();driver.manage (). timeouts (). implicitlyWait (2, TimeUnit.SECONDS);int size = driver.findElements (By.tagName ("iframe")). size ();System.out.println ("Łączna liczba ramek -" + rozmiar);// wypisuje całkowitą liczbę klatekdriver.switchTo (). frame (0); // Przełączanie ramki zewnętrznejSystem.out.println (driver.findElement (By.xpath ("xpath elementu zewnętrznego")). GetText ());// Drukowanie tekstu w zewnętrznej ramcesize = driver.findElements (By.tagName ("iframe")). size ();// wypisuje całkowitą liczbę ramek wewnątrz ramki zewnętrznejSystem.out.println ("Łączna liczba ramek -" + rozmiar);driver.switchTo (). frame (0); // Przełączanie na wewnętrzną ramkęSystem.out.println (driver.findElement (By.xpath ("xpath elementu wewnętrznego")). GetText ());// Drukowanie tekstu w ramce wewnętrznejdriver.switchTo (). defaultContent ();}}
Wyjście : Wynik powyższego kodu spowoduje wydrukowanie tekstu w ramce wewnętrznej i ramce zewnętrznej.