Hur man hanterar iFrames i Selenium Webdriver: switchTo()

iFrame in Selenium Webdriver

iFrame in Selenium Webdriver är en webbsida eller en inline-ram som är inbäddad i en annan webbsida eller ett HTML-dokument inbäddat i ett annat HTML-dokument. Iframe används ofta för att lägga till innehåll från andra källor som en annons på en webbsida. iframen definieras mediframe> tagg.

Hur man identifierar iFrame

Vi kan inte upptäcka ramarna genom att bara se sidan eller genom att inspektera Firebug.

Observera bilden nedan. Annonsen som visas är en iframe, vi kan inte hitta eller känna igen det genom att bara inspektera med Firebug. Så frågan är hur kan du identifiera iframen?

Vi kan identifiera ramarna i Selenium med metoder som anges nedan:

• Högerklicka på elementet. Om du hittar alternativet som "Denna ram" är det en iframe.(Se diagrammet ovan)
• Högerklicka på sidan och klicka på 'Visa sidkälla' och sök med 'iframe', om du kan hitta något taggnamn med 'iframe' så betyder det att sidan består av en iframe.

I diagrammet ovan kan du se att 'Denna ramalternativet är tillgängligt när du högerklickar, så vi är nu säkra på att det är en iframe.

Vi kan till och med identifiera det totala antalet iframes genom att använda kodavsnittet nedan.

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

Hur man hanterar ramar i Selenium med WebDriver-kommandon

I grund och botten kan vi byta över elementen och hantera ramar i Selenium på 3 sätt.

• Efter Index
• Med namn eller ID
• Efter webbelement

Metod 1: Växla till ram för index

Index är ett av attributen för ramhantering i Selenium genom vilken vi kan byta till det.

Index för iframe börjar med '0'.

Anta att om det finns 100 ramar på sidan kan vi byta till ram in Selenium genom att använda index.

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

Metod 2: Växla till ramen med namn eller ID

Namn och ID är attribut för att hantera ramar i Selenium genom vilken vi kan byta till iframe.

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

Exempel på att byta till iframe via ID:

till ramen av Web Element

Vi kan komma åt denna iframe via nedanstående URL: https://demo.guru99.com/test/guru99home/

Det är omöjligt att klicka iframe direkt genom XPath eftersom det är en iframe. Först måste vi byta till ramen och sedan kan vi klicka med hjälp av xpath.

Steg 1)

WebDriver driver = new FirefoxDriver();

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

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

• Vi initierar Firefox förare.
• Navigera till webbplatsen "guru99" som består av iframen.
• Maximerade fönstret.

Steg 2)

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

• I det här steget måste vi ta reda på ID för iframe genom att inspektera genom Firebug.
• Byt sedan till iframe via ID.

Steg 3)

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

• Här måste vi ta reda på xpath för elementet som ska klickas.
• Klicka på elementet med webbdrivrutinskommandot som visas ovan.

Här är hela koden:

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***************");
      }
}		

Produktion:

Webbläsaren navigerar till sidan som består av ovanstående iframe och klickar på iframen.

Metod 3: Växla till ramen med webbelement

Vi kan till och med byta till iframe med webbelement.

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

Hur man växlar tillbaka till huvudramen

Vi måste komma ut ur iframen.

För att gå tillbaka till den överordnade ramen kan du antingen använda switchTo().parentFrame() eller om du vill gå tillbaka till huvudramen (eller den mest överordnade) kan du använda switchTo().defaultContent();

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

Så här byter du över ramen, om vi INTE KAN byta med ID eller webbelement:

Anta att om det finns 100 ramar på sidan och det inte finns något ID tillgängligt, i det här fallet vet vi bara inte från vilket element som krävs för iframe som laddas (Det är fallet när vi inte känner till indexet för ramen också).

Lösningen för ovanstående problem är att vi måste hitta indexet för iframen genom vilken elementet laddas och sedan måste vi byta till iframen genom indexet.

Nedan följer stegen för att hitta indexet för den ram som elementet laddas med genom att använda nedanstående kodavsnitt

Steg 1)

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

• Initiera Firefox förare.
• Navigera till webbplatsen "guru99" som består av iframe.
• Maximerade fönstret.

Steg 2)

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

• Ovanstående kod hittar det totala antalet iframes som finns på sidan med taggnamnet 'iframe'.

Steg 3)

Mål för detta steg skulle vara att ta reda på indexet för 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();}

Ovan "forloop" itererar alla iframes på sidan och den skriver ut "1" om vår nödvändiga iframe hittades annars returnerar "0".

Här är hela koden till steg 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();}}}

Kör det här programmet och utdata blir som nedan:

Produktion:

1
0
0
0	
0
0

Verifiera utgången, du kan hitta serien av 0:or och 1:or.

• Varhelst du hittar '1' i output som är indexet för Frame med vilket elementet laddas.
• Eftersom indexet för iframen börjar med '0' om du hittar 1:an i 1:an^stplats, då är index 0.
• Om du hittar 1 av 3^rd plats är index 2.

Vi kan kommentera for-slingan när vi hittat indexet.

Steg 4)

driver.switchTo().frame(0);

• När du har hittat indexet för elementet kan du växla över ramen med kommandot ovan.
• driver.switchTo().frame(index hittat från steg 3);

Steg 5)

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

• Ovanstående kod kommer att klicka på iframen eller elementet i iframen.

Så hela koden skulle se ut som nedan:

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***************");
	        }
	    }

Produktion:

Webbläsaren navigerar till sidan som består av ovanstående iframe och klickar på iframen.

Koncept med kapslade ramar i Selenium

Låt oss anta att det finns två ramar, den ena inuti den andra som visas i bilden nedan och vårt krav är att skriva ut texten i den yttre ramen och den inre ramen.

När det gäller kapslade ramar,

• Först måste vi byta till den yttre ramen med antingen Index eller ID för iframen
• När vi väl byter till den yttre ramen kan vi hitta det totala antalet iframes inuti den yttre ramen, och
• Vi kan byta till den inre ramen med någon av de kända metoderna.

När vi går ut ur ramen måste vi gå ut i samma ordning som vi gick in i den från den inre ramen först och sedan den yttre ramen.

Html-koden för ovanstående kapslade ram är som visas nedan.

Ovanstående HTML-kod förklarar tydligt iframe-taggen (markerad i grönt) i en annan iframe-tagg, vilket indikerar närvaron av kapslade iframes.

Nedan följer stegen för att byta till yttre ram och skriva ut texten på yttre ramar:

Steg 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());

• Byt till den yttre ramen.
• Skriver ut texten på den yttre ramen.

När vi väl byter till den yttre ramen bör vi veta om någon inre ram finns inuti den yttre ramen

Steg 2)

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

• Hittar det totala antalet iframes inuti den yttre ramen.
• Om storleken hittas '0' finns det ingen inre ram inuti ramen.

Steg 3)

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

• Byt till den inre ramen
• Skriver ut texten på den inre ramen.

Här är hela koden:

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();
	}
}

Produktion:

Utdata från ovanstående kod skulle skriva ut texten i den inre ramen och den yttre ramen.

Vanliga frågor