Iframes are the HTML documents which are embedded inside the web pages. Iframes are itself the small webpages which are embedded in the main webpages. Iframes are used when to include some 3rd party elements inside the webpage like google advertisements are embedded in Iframes. Iframes can contains iframes within it self. In this post we will learn how to deal with Iframes in selenium using web driver.
Working with Iframes in Selenium
While doing automation we may come with many webpages which includes Iframes and in this article we will learn how to switch to iframes and how to perform events on the iframe elements.
How to recognize whether the document is Iframe ?
Iframe elements always have tag <iframe> </iframe>
Iframe example –
<iframe id="authiframe" src="/accounts/login/?iframe=1&next=https://www.goibibo.com/" width="100%" height="480px"></iframe>
Note : Iframe always start with tags <iframe> and ends with </iframe>.
Note : we can also recognize an iframe by just right clicking on the frame and check “This Frame” is shown on the list like in below screen shot.
How to work with Iframes in selenium ?
Whenever we need to work with Iframes we need to switch first to the Iframes and then perform the task within Iframes and then swtich back again to the main page.
Syntax to Switch to Iframe commands
We can switch to IFrames in 3 ways
1) By Index – we can switch to Iframe with the index of Iframe , Index of Iframes starts with 0 and in top-down order , the iframes comes first in web page has index 0 and the second iframe has index 1 and so on. usually a webpage has maximum of 3-4 iframes.
Syntax –
// here we pass index of the frame //driver.switchTo().frame(intindex); driver.switchTo().frame(2);
2) By Name or Id – Switch to the iframe with its given Id or Name .
Syntax –
// here we pass id or name of the frame
//driver.switchTo().frame(String arg);
driver.switchTo().frame("frame1");
3) By WebElement – Switch to Iframe with the webelement.
Syntax –
// here we pass webelement to the frame //driver.switchTo().frame(WebElement arg); driver.switchTo().frame(WebElement);
Note : driver.switchTo().frame() functions supports function overloading in selenium as we can pass the different parameters in same function.
How to count the number of frames in a webpage ?
Description of the Program –
1) Here we will first click on the “SIGN IN” button
2) Window popup will appear and then we will enter the phone number in the “text box”.
3) This text box is present inside the frame with id “authiframe“. So we have to switch to the iframe first then we can send the text to textbox.
4) After that we will click on cross[X] button of window popup to close the popup.
5) This cross[X] button is present inside the main page not on the frame .
6) We will switch to the the main page now and then click on [X] button.
Note : If we trying to locate the frame without switching to the frame we will get the exception “NoSuchElementException: Unable to locate element: ”
Java Program to handle iframes in selenium
//
//
import java.util.concurrent.TimeUnit;
import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.firefox.FirefoxDriver;
public class Iframe_Tutorial {
public static void main(String[] args) throws InterruptedException {
// setting the gecko driver path
System.setProperty("webdriver.gecko.driver", "geckodriver.exe");
//openbrowser
WebDriver driver=new FirefoxDriver();
driver.get("http://www.goibibo.com/"); // Open URL
driver.manage().window().maximize(); // maximize the window
// implicit wait is defined with max waiting time of 20 seconds
driver.manage().timeouts().implicitlyWait(5, TimeUnit.SECONDS);
//click on signin button
driver.findElement(By.xpath("//*[@id='hdr_user_signin']/span/a[1]")).click();
// switch to the frame
driver.switchTo().frame("authiframe");
//Enter email id in text box
driver.findElement(By.id("authMobile")).sendKeys("9999999999");
// switch to main window content
driver.switchTo().defaultContent();
// thread sleep to see the the alert box for demo
Thread.sleep(5000);
//click on the cross[X] button of the pop up
driver.findElement(By.xpath("//div[@class='popContent']/a")).click();
//close the driver
driver.close();
}
}
How to count number of iframes in a webpage?
This is the most common interview question of selenium and could be asked in any interview. Lets find the number of frames in webpage with the method “driver.findElements(By.tagName(“iframe”)).size()“. It will fetch total number of iframes of webpage. Have a look at below java selenium program.
Java Program
//
//
import java.util.concurrent.TimeUnit;
import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.firefox.FirefoxDriver;
public class Count_Number_of_Frames {
public static void main(String[] args) {
// setting the gecko driver path
System.setProperty("webdriver.gecko.driver", "geckodriver.exe");
//openbrowser
WebDriver driver=new FirefoxDriver();
driver.get("http://www.goibibo.com/"); // Open URL
driver.manage().window().maximize(); // maximize the window
// implicit wait is defined with max waiting time of 5 seconds
driver.manage().timeouts().implicitlyWait(5, TimeUnit.SECONDS);
// finding the number of frames size
int numberofframes = driver.findElements(By.tagName("iframe")).size();
// This will print the number of frames count
System.out.println(numberofframes);
// it will print 5 .. there are total 5 frames in webpage
}
}
How to switch to iframes when we have no id and name of iframe?
1) First thing we need to understand that there is always index associated with each iframe and it works in top to bottom manner which means that the first iframe appears from the top will have the index “0” and the next frame will have the index “1” and like so on.
2) So if you want to switch to some frame when you don’t have any information then you count the frame and switch it to the frame with its Index.
Hope you can answer this question in interview now.
How to switch to iframes which is inside another frame ( Nested iframes )?
Below are the nested frames in which parentframe is inside the Main window and “childframe” is inside the “parentframe” .
Suppose we need to click on the Object1 then we need to switch to the parent frame first with command ” driver.switchTo().frame(“parentframe”)” and then click on the object1.
Suppose we need to click on the Object2 then we need to switch to parentframe first then we need to switch to the childframe again and then we can click on the object. Below are the java commands
driver.switchTo().frame(“parentframe”);
driver.switchTo().frame(“childframe”);
Object2.click()
Note : driver.switchTo().defaultContent() is always switch to the main page whether you inside any frame . If control is inside childframe and we use this coomand “driver.switchTo().defaultContent() ” It will switch to main window only not to the parent frame. Remember this point it can be asked in interview.
Hope you enjoyed this article and you can also enroll for my selenium online training.
Enroll for the Selenium online Training