Handling Windows and iFrames in Selenium

Introduction - Handling Windows

In automation, when we have multiple windows in any web application, the activity may need to switch control among several windows from one to other in order to complete the operation. After completion of the operation, it has to return to the main window that is the parent window in Selenium.

What is a window handle?

It is a unique identifier that holds the address of all the windows. Think of it as a pointer to a window, which returns the string value. It is assumed that each browser will have a unique window handle. This window handle function helps to retrieve the handles of all windows

Syntax

get.windowhandle(): This method helps to get the window handle of the current window
get.windowhandles(): This method helps to get the handles of all the windows opened
set: This method helps to set the window handles in the form of a string. set<string> set= driver.get.windowhandles()
switch to: This method helps to switch between the windows
action: This method helps to perform certain actions on the windows

Scenario based explanation for handling multiple windows in selenium

Scenario: Navigate to the www.leafground.com This is the parent window. From the parent window, let’s see how to handle the child windows and then again navigate back to the parent windows.

Steps to execute:

Get the handle of the parent window using the command: String parentWindowHandle = driver.getWindowHandle();
Print the window handle of the parent window.
Find the element on the web page using an ID which is an element locator.
Open multiple child windows.
Iterate through child windows.
Get the handles of all the windows that are currently open using the command: Set<String> allWindowHandles = driver.getWindowHandles(); which returns the set of handles.
Use the SwitchTo command to switch to the desired window and also pass the URL of the web page.

Below code (figure 1) clearly explains of getting into home page of a website which is called a parent window, here it is stored as old window and clicking a button in the homepage.

figure 1

Below code(figure 2) clearly explains how multiple windows are handled using advance for loop where web driver is directed to the child window after clicking the first button in the parent window.

figure 2

Below code (figure 3) clearly explains how to navigate back to the home page(parent window) from the child window where the browser is having it's current instance.Navigation to the parent window is done after comparing all the newly opened windows with the parent window through the iteration process in the advance for loop.For all the unsuccessful iteration driver will close the child window taken for comparison. It also prints the number of windows opened by inhibiting size() method.

figure 3

Conclusion:

The above blog related to window handling provides a detailed overview on different strategies used for navigating back and forth between multiple windows in realtime application using selenium web driver.

Handling iframes in Selenium Web driver

Introduction : iFrame in Selenium Web driver is a web page or an inline frame which is embedded in another web page or an HTML document embedded inside another HTML document. The iframe is often used to add content from other sources like an advertisement into a web page. The iframe is defined with the <iframe> tag.

What is a Frame?

The frame enables a developer to split the screen horizontally or vertically by using the frame set tag.

Note: Frame and frame set tags are deprecated as they are no longer supported by HTML 5.

How to identify iframes?

The iframes are mainly used to insert content from external sources. For example, an advertisement displayed on a web page. They can float within the webpage, which means one can position an iframe at a specific position on a web page.

For a browser to automatically start interacting with the web page, the browser needs to identify the elements under the frame for selenium testing. It is possible to identify the iframes on a web page in two ways:

Step 1 :Right-click on the specific element and check all the options. If you find an option like This Frame, view Frame source or Reload Frame, the page includes frames.Consider the image below as an example.

Step 2: Similar to the first step, right-click on the page and click on View Page Source. On the page source, search for “iframe-tags”. If you find any iframe tags, it means the page includes iframes.

Basic Commands for switching between frames in selenium

Basically, we can switch over the elements and handle frames in Selenium using 3 ways.

By Index
By Name or Id
By Web Element

Method 1: Switch to the frame by index

Index is one of the attributes for frame handling in Selenium through which we can switch to it.

Index of the iframe starts with ‘0’.

Suppose if there are 100 frames in page, we can switch to frame in Selenium by using index.

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

Method 2: Switch to the frame by Name or ID

Name and ID are attributes for handling frames in Selenium through which we can switch to the iframe.

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

Method 3: Switch to the frame by Web Element

We can even switch to the iframe using web element .

driver.switchTo().frame(WebElement);

How to switch back to the Main Frame

We have to come out of the iframe.

To move back to the parent frame, you can either use switchTo().parentFrame() or if you want to get back to the main (or most parent) frame, you can use switchTo().defaultContent();

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

Sample code for switching between frames and to count total number of frames

To find the total number of frames List data structure is used for storing the count which is described in the snippet shared below.

Concept of Nested Frames in Selenium:

Let’s assume that there are two frames one inside other like shown in below image and our requirement is printing the text in the outer frame and inner frame.

In the case of nested frames,

At first we must switch to the outer frame by either Index or ID of the iframe
Once we switch to the outer frame we can find the total number of iframes inside the outer frame, and
We can switch to the inner frame by any of the known methods.

While exiting out of the frame, we must exit out in the same order as we entered into it from the inner frame first and then outer frame.

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

Switch to the outer Frame.
Prints the text on outer frame.

Once we switch to the outer frame, we should know whether any inner frame present inside the outer frame

Step 2 :

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

Finds the total number of iframes inside outer frame.
If size was found ‘0’ then there is no inner frame inside the frame.

Step 3 :

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

Switch to the inner frame
Prints the text on the inner frame.

Conclusion : Blog about iframes provides an overview about the different methods of defining iframes.