Frame Handling in Selenium Web Driver
Frame Handling in Selenium Web Driver
In this tutorial, we will learn how to handle Frame and iframe (inline frame) in the selenium web driver.
Frame and iframe Html tag will be used to insert one html code page to another html page.
Let us see the difference between frame and iframe:
| Frame | Iframe |
| The frame is used to divide a web page into multiple parts and having a new content of each section. | The iframe (inline frame) is used to embed the content of the external websites on the web page to avoid cross-site scripting issues. |
| The Frame is more secure. | The iframe is less secure. |
| The <Frame>…..</Frame> html tag is used to identify the frame in the Html document. | The <iframe>……</iframe> html tag is used to identify the iframes in the Html document. |
Note: <Frame> tag is deprecated from the latest version of the HTML.
To check whether the element is available inside the frame or not, we should right-click near the component, and we can see This Frame options and get now how many frames are available in the UI.
Whenever elements present inside the frame, such elements cannot be handled by the web driver automatically.
Note: If the required frame is not found on the current web page it will throw NoSuchFrameException.
To work with frame window element, we have switchTo().frame command available in selenium web driver.
We can use switchTo().frame command in multiple ways for handling the frame window, which are as following :
- switchTo().frame(int arg0):web driver
- switchTo().frame(String arg0):web driver
- switchTo().frame(WebElement arg0):web driver
- switchTo().parentFrame():web driver
- switchTo().defaultContent():web driver
The following are the methods provided by selenium web driver for handling the Frame is as below:
- switchTo.frame(int):
It is used to switch the frame by passing its index value.
If the Frame index value is zero, that means the first Frame of the particular web page, and the index value is zero, the index value one is used for the second frame, and so on.
| Command | Syntax |
| frame(int arg0):web driver | driver.switchTo().frame(“value of the index”); |
- switchTo().frame(String):
It is used to switch the frame by passing its name and id attribute.
The String value should be in the double-quotes.
| Command | Syntax |
| frame(String arg0):web driver | driver.switchTo().frame(“value of its name and id attribute”); |
- switchTo().Frame(WebElement):
It is used to switch the frame whenever Frame html tag does not contain its id and name attribute.
In such cases, we will go XPath to identify the frame window and then switch to the frame window by taking the help of the web element.
This method is used to switch the frame based on the location of the web Element
Example:
WebElement fwb=driver.findElement(By.Xpath(“//frame[@title=’frameinner’]));
driver.switchTo().frame(fwb);
| Command | Syntax |
| frame(WebElement arg0):web driver | driver.switchTo().frame(“value of Web Element”); |
- switchTo().parentFrame()
It is used for achieve the parent frame window. And we cannot pass driver control from one frame to another frame, but we can pass driver control from the parent frame to the child frame.
| Command | Syntax |
| parentFrame():web driver | driver.switchTo().parentFrame(); |
- switchTo().defaultContent():
This driver control is used for coming back to the main window.
And to work or handle multiple frames, we should pass driver control back to the main window before switching to another frame.
| Command | Syntax |
| defaultContent():web driver | driver.switchTo().defaultcontent(); |
Note: driver.switchTo().parentFrame() and river.switchTo().defaultContent() both methods are similar for switching frame in the selenium web driver.
But there is one difference between them, which is that the parentFrame() is used to switch the driver control to its parent frame of the current frame, and when any action performed on the multiple frame window, then defaultContent() is used to take the driver control back to the main web page window.
Let us take one example to give you a better understanding of frame handling, and we created a sample test script which is as follows;
For our testing purpose, we are using the seleniumhq.github website to perform all the actions for frame handling in selenium web driver.
In this test case, we will automate the following test scenarios:
| Steps | Action | Method Used | Input | Excepted Result |
| 1. | Open the Firefox Browser. | System.setProperty() | The Firefox browser must be opened. | |
| 2. | Navigate to the URL. | get() | https://seleniumhq.github.io/selenium/docs/api/java/index.html | The home page window must be displayed. |
| 3. | Pass the driver control to the class frame. | switchTo.frame(WebElement) | The class frame should be handled. | |
| 4. | Click on the link present on the class frame with the help of a Link text locator. | com.thoughtworks.selenium | The given link should be clicked. | |
| 5. | Pass the driver control to the main window. | switchTo.defaultContent(); | Driver control should move to the main window. | |
| 6 | Pass the driver control to another frame window which is package frame. | switchTo()frame(“String) | The package frame should be handled. | |
| 7. | Click on the link present on the package frame with the help of a Link text locator. | action | The given link should be clicked. | |
| 8. | Quit the Browser. | quit() | The browser should beterminated. |
Open the Eclipse IDE and the existing test suite new_test, which we have created in WebDriver Installation section of the WebDriver tutorial.
Then, right-click on the src folder and create a new Class File from New à Class.
- Give the Class name as Frame_handling and click onthe Finish button.
We are creating our test case step by step to give you a complete understanding of driver control in the selenium WebDriver.
Step1:
To launch the Firefox browser, we need to download the FirefoxDriver.exe file and set the system property to the path of FirefoxDriver.exe file.
Here is the code for setting the system property for the Firefox:
// System Property for gecko Driver
System.setProperty("webdriver.gecko.driver","C:\\Users\\JTP\\Downloads\\geckodriver-0.25.0-in64\\geckodriver.exe");
// create an object for FirefoxDriver class.
WebDriver driver=new FirefoxDriver();
Step2:
Now, we will get to the desired URL:
//navigate to the home page of seleniumhq.
driver.get("https://seleniumhq.github.io/selenium/docs/api/java/index.html");
Step3:
First, right-click on the class frame and select view page source field.
After that, the view page source window is opened, then copy the value of its name attribute, i.e.,” classFrame.”
Here the sample code,
//pass a driver control to frame-2(class frame)
WebElement fwb=driver.findElement(By.xpath("//frame[@name='classFrame']"));
driver.switchTo().frame(fwb);
Thread.sleep(2000);
System.out.println("class frame is opened");
Step4:
Now, we are moving our next steps, where we will move to the first link (com.thoughtwork.selenium) present in the package frame window, and select the Inspect element field.
The developer tool window will be launched, with all the specific codes used in the development of thegiven link.
Copy the value of the first link, i.e.,”com.thoughtwork.selenium.”
Here the sample code,
//click on a link present in the frame-2
driver.findElement(By.linkText("com.thoughtworks.selenium")).click();
Thread.sleep(3000);
System.out.println("given link is cliked");
Step5:
In the next step of our sample test script, we will pass the driver control to the main window using the defaultContent() method.
Here the sample code,
//pass driver control to parent window driver.switchTo().defaultContent(); Thread.sleep(3000);
Step6:
After that, right-click near on the package frame and select the view page source field.
And, the view page source window is opened, then copy the value of name attribute, i.e.,” package Frame.”
Here the sample code,
//pass a driver control to frame-3(package frame)
driver.switchTo().frame("packageFrame");
Thread.sleep(2000);
System.out.println("package frame is opened");
Step7:
Now, in our next step, we will move the actions class link and select the Inspect element field.
The developer tool window will be launched, with all the specific codes used in the development of thegiven link.
Copy the value of the particular link, i.e., “Actions.”
Here the sample code,
//click on a link, present in frame-3
driver.findElement(By.linkText("Actions")).click();
Thread.sleep(3000);
System.out.println("given link is cliked");
Step8:
Finally, we terminate the process and quit the browser.
//quit the browser driver.quit();
After that, our final test script will look like this:
package testpackage;
import java.util.concurrent.TimeUnit;
import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.firefox.FirefoxDriver;
public class Frame_handling {
public static void main(String[] args) throws InterruptedException {
// System Property for gecko Driver
System.setProperty("webdriver.gecko.driver","C:\\Users\\JTP\\Downloads\\geckodriver-V0.25.0-win64\\geckodriver.exe");
// create an object for FirefoxDriver class.
WebDriver driver=new FirefoxDriver();
//maximize he window size
driver.manage().window().maximize();
//delate all the cookies
driver.manage().deleteAllCookies();
//dynamic wait
driver.manage().timeouts().pageLoadTimeout(40, TimeUnit.SECONDS);
//navigate to the URL
driver.get("https://seleniumhq.github.io/selenium/docs/api/java/index.html");
//pass a driver control to frame-2(class frame)
WebElement fwb=driver.findElement(By.xpath("//frame[@name='classFrame']"));
driver.switchTo().frame(fwb);
Thread.sleep(2000);
System.out.println("class frame is opened");
//click on a link present in the frame-2
driver.findElement(By.linkText("com.thoughtworks.selenium")).click();
Thread.sleep(3000);
System.out.println("given link is cliked");
//pass driver control to parent window
driver.switchTo().defaultContent();
Thread.sleep(3000);
//pass a driver control to frame-3(package frame)
driver.switchTo().frame("packageFrame");
Thread.sleep(2000);
System.out.println("package frame is opened");
//click on a link present in frame-3
driver.findElement(By.linkText("Actions")).click();
Thread.sleep(3000);
System.out.println("given link is cliked");
//quit the browser
driver.quit();
}
}
- To run the test script in Eclipse, right-click on the window and then click Run as à Java application.
- The test script will be launched in the Firefox browser and automate all the test scenarios.
And the output of all the print command is as shown below,
