2. IFrames
An IFrame (Inline Frame) is an HTML document embedded inside another HTML
document on a website. The IFrame HTML element is often used to insert content from
another source, such as an advertisement, into a Web page. Although an IFrame behaves
like an inline image, it can be configured with its own scrollbar independent of the
surrounding page's scrollbar.
We will learn -
1. How do switch over the elements in iframes using WebDriver.
2. Nested Frames (Frames inside Frames)
3. How do switch over
the elements in
iframes using
WebDriver.
To Switch between iFrames
we have to use the driver’s
switchTo().frame()
command. After switching to
an Iframe we will be able to
work on web elements.
Basically, We can use the switchTo().frame() in three
ways to access the iframe.
● By Index
● By Name or Id
● By Web Element
5. Switching By Index:
Syntax: switchTo.frame(frameindex);
Index of an iFrame is the position at which it
occurs in the HTML page.
Index of the iframe starts with '0'.
If we have two Iframes, Index 0 will be the
iFrame which exists earlier in the HTML page.
E.g
Switching to the First IFrame
driver.switchTo().frame(0);
Switching to the Second IFrame
driver.switchTo().frame(1);
6. Switching By Name / ID:
Syntax: switchTo.frame(“framename or frameID”);
We can also switch to iframes using values of
their name attribute or ID attribute.
E.g
Switching to an iframe using name attribute
driver.switchTo().frame("iframe1");
Switching to an iframe using ID attribute
driver.switchTo().frame("Frame1");
7. Switching by WebElement:
Syntax: switchTo.frame(iframelocator);
We can switch to an iFrame by simply passing
the iFrame WebElement.
First, we need to find the iFrame element using
any of the locator strategies and then pass it to
switchTo.frame() command.
E.g
Finding webelement by ID locator
WebElement iframeElement =
driver.findElement(By.id("Frame1"));
Switching to an iframe using webelement
driver.switchTo().frame(iframeElement);
8. How to switch back to
the Main Page or Main
Frame
After doing all the operation
to iframe element, we need
to get back to the main page.
As in our sample page, the
main page is the page in
which contains two iFrames.
Once we are done with all
the task in a particular
iFrame you can switch back
to the main page.
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();
E.g
Switching to the First IFrame
driver.switchTo().frame(0);
Do all the required tasks in the frame 0
driver.findElement(//*@id=’activate_key’]).sendKeys(“AS9g”);
Switch back to the main window
driver.switchTo().defaultContent();
10. Nested Frames
(Frames inside
Frames)
In case we have a web page
that contains two frames
one inside other like shown
in Sample Page 2 and we
need to perform some
operations.
1. To begin with, We must switch to the outer
frame(iframe1) by any of the known methods.
2. After switching to the outer frame(iframe1) we can
find the total number of iframes inside the outer
frame(iframe1).
driver.findElements(By.tagName("iframe")).size();
3. We can switch to the inner frame(iframe2) by any of
the known methods and perform the desired
operation.
While exiting out of the frame, we must exit out in the
same order as we entered into it from the inner
frame(iframe2) first and then outer frame(iframe1).
11. Now we know how to handle Iframes
using Selenium Webdriver
Thank You
Pankaj Biswas