iFrame || Multiple ways to handle iFrame html tag using selenium.

          In our, last post we had learned how to handle iframes on a web page as we can’t access web element present inside an iframe directly. There are multiple ways to handle iframe using selenium. We have to first switch the focus inside the iframe using the switchTo statement only then we would be able to access the elements inside it. We can say there are multiple methods have been associated with switchTo statement to achieve the same.

Basically, there are three ways to move into the iframe and two ways to move outside the iframe tags.

switchTo Methods
switchTo Methods

Locating iframe using index number and iframe name/id.

                 We can identify the iframes by its index number. Index of iframes starts from 0. The same way we can locate an iframe using its name or id.

driver.switchTo().frame(frameIndex);
driver.switchTo().frame("frameID or frameName");

Code Example:

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

public class Example2 
{
	public static void main(String[] args) throws InterruptedException
	{
		String URL="https://www.w3schools.com/tags/tryit.asp?filename=tryhtml_iframe";
		System.setProperty("webdriver.chrome.driver", "drivers//chromedriver.exe");
		WebDriver driver=new ChromeDriver();
		driver.get(URL);

		// As here are two iframes one inside another, First we have used 'id' of the first iframe.
		Thread.sleep(5000);
		driver.switchTo().frame("iframeResult");
		
		// Now we have used index number to switch inner iframe. We can also use id or name of the iframe.
		driver.switchTo().frame(0);
		
		String logoXpath="//*[@class='w3-center']/a";
		String logoText= driver.findElement(By.xpath(logoXpath)).getText();
		System.out.println("Logo Text Inside the iframes: "+logoText);
	}
}

Output:
Logo Text Inside the iframes: w3schools.com


Locating iframe using its xPath or web element

           Another way to locate an iframe using its xPath or web element. This would be used when there is no name or id is present for the iframe.

String iframeXpath="/html/body/iframe";
WebElement frameElement=driver.findElement(By.xpath(iframeXpath));
driver.switchTo().frame(frameElement);

Code Example:

import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;

public class Example3 
{
	public static void main(String[] args) throws InterruptedException
	{
		String URL="https://www.w3schools.com/tags/tryit.asp?filename=tryhtml_iframe";
		System.setProperty("webdriver.chrome.driver", "drivers//chromedriver.exe");
		WebDriver driver=new ChromeDriver();
		driver.get(URL);

		Thread.sleep(5000);
		driver.switchTo().frame(0);
		
		// To move into the next iframe, now we will use xPath of the nested iframe.
		String iframeXpath="/html/body/iframe";
		WebElement frameElement=driver.findElement(By.xpath(iframeXpath));
		driver.switchTo().frame(frameElement);
			
		String logoXpath="//*[@class='w3-center']/a";
		String logoText= driver.findElement(By.xpath(logoXpath)).getText();
		System.out.println("Logo Text Inside the iframes: "+logoText);
		}
}

Move out to the iframe(s)

There are two ways to move out from iframe(s). First is only to get out from the current frame.

driver.switchTo().frame(0).switchTo().frame(0);
driver.switchTo().parentFrame();

The second method will bring focus to the main content area from all iframes or nested iframes.

driver.switchTo().frame(0).switchTo().frame(0);
driver.switchTo().defaultContent();

Code Example:

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

public class Example4 {
	public static void main(String[] args) throws InterruptedException 
	{
		String URL="https://www.w3schools.com/tags/tryit.asp?filename=tryhtml_iframe";
		System.setProperty("webdriver.chrome.driver", "drivers//chromedriver.exe");
		WebDriver driver=new ChromeDriver();
		driver.get(URL);

		Thread.sleep(5000);
		driver.switchTo().frame(0).switchTo().frame(0);

		String logoXpath="//*[@class='w3-center']/a";
		String logoText= driver.findElement(By.xpath(logoXpath)).getText();
		System.out.println("Logo Text Inside the iframes: "+logoText);
		
		// Now move outside the current iframe only.
		driver.switchTo().parentFrame();
		
		// We have to use the above statement again to move outer iframe also.
		driver.switchTo().parentFrame();
		
		/*
		  // Alternatively we can use below statement to move directly to the main content area.
		  // By removing above Step #6-7
		driver.switchTo().defaultContent();
		 */
		
		// Locate web element outside the iframe tags.
		String resultSizeXpath="//*[@id='framesize']";
		System.out.println("Outside iframes: "+driver.findElement(By.xpath(resultSizeXpath)).getText());
	}
}

Output:
Logo Text Inside the iframes: w3schools.com
Outside iframes: Result Size: 502 x 427

1602total visits,5visits today

3 thoughts on “iFrame || Multiple ways to handle iFrame html tag using selenium.”

  1. Thanks for the sensible critique. Me and my neighbor were just preparing to do some research on this. We got a grab a book from our area library but I think I learned more clear from this post. I’m very glad to see such great info being shared freely out there.

Leave a Reply

Your email address will not be published. Required fields are marked *