Jak obsługiwać ramki iFrame w Selenium Sterownik internetowy: switchTo()

iRamka w Selenium Sterownik internetowy

iRamka w Selenium Sterownik internetowy to strona internetowa lub ramka wbudowana osadzona na innej stronie internetowej lub dokument HTML osadzony w innym dokumencie HTML. Element iframe jest często używany do dodawania treści z innych źródeł, np. reklam, do strony internetowej. Element iframe jest zdefiniowany za pomocąiframe> znacznik.

Jak zidentyfikować ramkę iFrame

Nie możemy wykryć ramek, po prostu przeglądając stronę lub sprawdzając Firebug.

Spójrz na poniższy obraz, wyświetlana reklama to iframe, nie możemy jej zlokalizować ani rozpoznać, po prostu sprawdzając ją za pomocą Firebug. Pytanie brzmi, jak można zidentyfikować iframe?

Możemy zidentyfikować ramki w Selenium stosując metody podane poniżej:

• Kliknij element prawym przyciskiem myszy. Jeśli znajdziesz opcję „Ta ramka”, oznacza to, że jest to ramka iframe. (Proszę zapoznać się z powyższym diagramem)
• Kliknij stronę prawym przyciskiem myszy, kliknij „Wyświetl źródło strony” i wyszukaj za pomocą elementu „iframe”. Jeśli możesz znaleźć dowolną nazwę tagu z elementem „iframe”, oznacza to, że strona składa się z elementu iframe.

Na powyższym schemacie widać, że „Ta rama' opcja jest dostępna po kliknięciu prawym przyciskiem myszy, więc mamy teraz pewność, ż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 obsługiwać ramki w Selenium za pomocą poleceń WebDriver

Zasadniczo możemy przełączać elementy i obsługiwać ramki Selenium używając 3 sposobów.

• Według indeksu
• Według nazwy lub identyfikatora
• Przez element sieciowy

Metoda 1: Przejdź do ramki według indeksu

Indeks jest jednym z atrybutów obsługi ramek w Selenium dzięki któremu możemy się na to przełączyć.

Indeks ramki iframe zaczyna się od „0”.

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

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

Metoda 2: Przejdź do ramki według nazwy lub identyfikatora

Nazwa i identyfikator to atrybuty służące do obsługi ramek Selenium za pomocą którego możemy przejść do ramki iframe.

• driver.switchTo().frame("iframe1");
• driver.switchTo().frame("id of the element");

Przykład przejścia na ramkę iframe poprzez identyfikator:

do ramki przez element sieciowy

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

Nie można bezpośrednio kliknąć elementu iframe XPath ponieważ jest to element iframe. Najpierw musimy przejść do ramki, a następnie możemy kliknąć za pomocą xpath.

Krok 1)

WebDriver driver = new FirefoxDriver();

driver.get("https://demo.guru99.com/test/guru99home/");

driver.manage().window().maximize();

• Inicjujemy Firefox kierowca.
• Przejdź do witryny „guru99”, która zawiera ramkę iframe.
• Zmaksymalizowano okno.

Krok 2)

driver.switchTo().frame("a077aa5e");

• Na tym etapie musimy znaleźć identyfikator elementu iframe, sprawdzając go za pomocą Firebuga.
• Następnie przejdź do elementu iframe poprzez identyfikator.

Krok 3)

driver.findElement(By.xpath("html/body/a/img")).click();

• Tutaj musimy znaleźć ścieżkę xpath elementu, który ma zostać kliknięty.
• Kliknij element za pomocą polecenia sterownika internetowego pokazanego powyżej.

Oto pełny kod:

public class SwitchToFrame_ID {
public static void main(String[] args) {

		WebDriver driver = new FirefoxDriver(); //navigates to the Browser
	    driver.get("https://demo.guru99.com/test/guru99home/"); 
	       // navigates to the page consisting an iframe

	       driver.manage().window().maximize();
	       driver.switchTo().frame("a077aa5e"); //switching the frame by ID

			System.out.println("********We are switch to the iframe*******");
     		driver.findElement(By.xpath("html/body/a/img")).click();
  		    //Clicks the iframe
       
  			System.out.println("*********We are done***************");
      }
}		

Wyjście:

Przeglądarka przechodzi do strony składającej się z powyższej ramki iframe i klika tę ramkę.

Metoda 3: Przejdź do ramki za pomocą elementu sieciowego

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

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

Jak wrócić do ramy głównej

Musimy wyjść z ramki iframe.

Aby wrócić do ramki nadrzędnej, możesz użyć przełącznika switchTo().parentFrame() lub, jeśli chcesz wrócić do ramki głównej (lub większości ramki nadrzędnej), możesz użyć przełącznikTo().defaultContent();

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

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

Załóżmy, że 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 (dzieje się tak w przypadku, gdy nie znamy indeksu ramki Również).

Rozwiązaniem powyższego problemu jest znalezienie indeksu ramki iframe, przez którą ładowany jest element, a następnie przejście do ramki iframe poprzez indeks.

Poniżej znajdują się kroki umożliwiające znalezienie indeksu ramki, według której ładowany jest element, przy użyciu poniższego fragmentu

Krok 1)

WebDriver driver = new FirefoxDriver();
driver.get("https://demo.guru99.com/test/guru99home/");
driver.manage().window().maximize();

• Zainicjuj Firefox kierowca.
• Przejdź do witryny „guru99”, która zawiera ramkę iframe.
• Zmaksymalizowano okno.

Krok 2)

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

• Powyższy kod sprawdza całkowitą liczbę ramek iframe znajdujących się na stronie przy użyciu zmiennej „iframe”.

Krok 3)

Cel dla tym krokiem 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(total);
	    driver.switchTo().defaultContent();}

Powyżej „forloop” iteruje wszystkie ramki iframe na stronie i wypisuje „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) {
	    WebDriver driver = new FirefoxDriver();
	    driver.get("https://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(total);
	    driver.switchTo().defaultContent();}}}

Wykonaj ten program, a wynik będzie wyglądał jak poniżej:

Wyjście:

1
0
0
0	
0
0

Sprawdź wynik, możesz znaleźć serię zer i jedynek.

• Gdziekolwiek znajdziesz na wyjściu „1”, jest to indeks ramki, według której element jest ładowany.
• Ponieważ indeks ramki iframe zaczyna się od „0”, jeśli znajdziesz 1 w 1^stmiejsce, wówczas indeks wynosi 0.
• Jeśli znajdziesz 1 na 3^rd miejsce, indeks wynosi 2.

Po znalezieniu indeksu możemy skomentować pętlę for.

Krok 4)

driver.switchTo().frame(0);

• Po znalezieniu indeksu elementu możesz przełączyć ramkę za pomocą powyższego polecenia.
• sterownik.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 ramce iframe.

Zatem pełny kod będzie wyglądał jak poniżej:

public class SwitchToframe   {
public static void main(String[] args) throws NoSuchElementException{
	    WebDriver driver = new FirefoxDriver();
	    driver.get("https://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(total);
	    driver.switchTo().defaultContent(); //switching back from the iframe
	 }*/
	            
		//Commented the code for finding the index of the element
	    driver.switchTo().frame(0); //Switching to the frame
		System.out.println("********We are switched to the iframe*******");
		driver.findElement(By.xpath("html/body/a/img")).click();
		
		//Clicking the element in line with Advertisement
	    System.out.println("*********We are done***************");
	        }
	    }

Wyjście:

Przeglądarka przechodzi do strony składającej się z powyższej ramki iframe i klika tę ramkę.

Koncepcja zagnieżdżonych ramek w Selenium

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ą poprzez indeks lub identyfikator ramki iframe
• Po przejściu na ramkę zewnętrzną możemy znaleźć całkowitą liczbę ramek iframe wewnątrz ramki zewnętrznej, oraz
• Na ramę wewnętrzną możemy przejść 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.

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

Powyższy kod HTML wyraźnie wyjaśnia znacznik iframe (podświetlony na zielono) w innym znaczniku iframe, wskazując obecność zagnieżdżonych ramek iframe.

Poniżej znajdują się kroki umożliwiające przełączenie na ramkę zewnętrzną i wydrukowanie tekstu na ramkach zewnętrznych:

Krok 1)

	WebDriver driver=new 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("Total Frames --" + size);
	    
		// prints the total number of frames 
		driver.switchTo().frame(0); // Switching the Outer Frame    		
	    System.out.println (driver.findElement(By.xpath("xpath of the outer element ")).getText());

• Przełącz na ramę zewnętrzną.
• Drukuje tekst na zewnętrznej ramce.

Kiedy już przejdziemy na ramę zewnętrzną, powinniśmy wiedzieć, czy wewnątrz ramki zewnętrznej znajduje się jakakolwiek ramka wewnętrzna

Krok 2)

size = driver.findElements(By.tagName("iframe")).size();
    // prints the total number of frames inside outer frame           
    System.out.println("Total Frames --" + size);

• Znajduje całkowitą liczbę ramek iframe wewnątrz ramki zewnętrznej.
• Jeśli znaleziono rozmiar „0”, oznacza to, że wewnątrz ramki nie ma ramki wewnętrznej.

Krok 3)

driver.switchTo().frame(0); // Switching to innerframe
System.out.println(driver.findElement(By.xpath("xpath of the inner element ")).getText());

• Przełącz na ramę wewnętrzną
• Drukuje tekst w ramce wewnętrznej.

Oto pełny kod:

public class FramesInsideFrames {
public static void main(String[] args) {
WebDriver driver=new 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("Total Frames --" + size);
               
		// prints the total number of frames 
		driver.switchTo().frame(0); // Switching the Outer Frame    		
	    System.out.println (driver.findElement(By.xpath("xpath of the outer element ")).getText());

		//Printing the text in outer frame
		size = driver.findElements(By.tagName("iframe")).size();
	    // prints the total number of frames inside outer frame           
                                                                                                          
	    System.out.println("Total Frames --" + size);
	    driver.switchTo().frame(0); // Switching to innerframe
	    System.out.println(driver.findElement(By.xpath("xpath of the inner element ")).getText());
		
		//Printing the text in inner frame
		driver.switchTo().defaultContent();
	}
}

Wydajność:

Dane wyjściowe powyższego kodu spowodują wydrukowanie tekstu w ramce wewnętrznej i ramce zewnętrznej.