How to Switch Between IFrames Using Selenium Python

In this Selenium Python tutorial, we’ll learn to switch between IFrames. An IFrame (Inline Frame) is an HTML element that allows rendering a document within another HTML document on a webpage.

We prefer to use IFrames when we aspire to host content from an external source on our webpage. It could be an image, a video, advertisements from other vendors, to highlight some information, etc.

HTML provides “< iframe > < /iframe >” tags to identify an IFrame inside an HTML document.

Switch Between IFrames Using Selenium Python

Switch Between IFrames Selenium Python

Switch Between IFrames: Selenium Python

If a webpage contains multiple IFrames, then we will need to switch between them. Selenium Python API provides “switch_to.iframe (self, frame_reference)” method to move to a particular IFrame.

driver.switch_to.iframe(self,frame reference)

Where,

the “<frame_reference>” parameter is the locator used to identify the IFrame.

Let’s take a sample HTML code that will create multiple IFrames in the web page.

<!DOCTYPE html>
<html>
<head>
<title>Switching Between IFrames Demo</title>
</head>
<body>
<h1>Welcome Viewers</h1>
<iframe name="frame1" id="FR1" src="http://www.techbeamers.com" height="500" width="400"> </iframe>
<iframe name="frame2" id="FR2" height="500" width="400" src="http://www.seleniumhq.org"> </iframe>
</body>
</html>

There are two IFrames embedded in this web page. To perform switching between the above IFrames first, we have to locate them on the web page. Take a look at the code; it provides three different mechanisms by which we can do this. They are.

– By using the tag name ( in this case ‘iframe’)

– By using the Id of IFrame

– By using the name of IFrame

Here is the specified code snippet to perform switching between frames.

from selenium import webdriver

from selenium.webdriver.common.keys import Keys

from selenium.webdriver.common.by import By

import time

driver = webdriver.Firefox()

driver.maximize_window()

location = "file://<Specify Path to IFrame.HTML>"

driver.get(location)

#Section-1

# get the list of iframes present on the web page using tag "iframe"

seq = driver.find_elements_by_tag_name('iframe')

print("No of frames present in the web page are: ", len(seq))

#switching between the iframes based on index

for index in range(len(seq)):

    driver.switch_to_default_content()

    iframe = driver.find_elements_by_tag_name('iframe')[index]

    driver.switch_to.frame(iframe)

    driver.implicitly_wait(30)

    #highlight the contents of the selected iframe

    driver.find_element_by_tag_name('a').send_keys(Keys.CONTROL, 'a')

    time.sleep(2)

    # undo the selection within the iframe

    driver.find_element_by_tag_name('p').click()

    driver.implicitly_wait(30)

driver.switch_to.default_content()

#Section-2

#switch to a specific iframe (First frame) using Id as locator

iframe = driver.find_element_by_id('FR1')

driver.switch_to.frame(iframe)

time.sleep(2)

driver.find_element_by_id('s').send_keys("Selected")

driver.switch_to.default_content()

#Section-3

#switch to a specific iframe (Second frame) using name as locator

iframe = driver.find_element_by_name('frame2')

driver.switch_to.frame(iframe)

time.sleep(2)

driver.find_element_by_tag_name('a').send_keys(Keys.CONTROL, 'a')

Let’s analyze the above code step by step.

1) First of all, you must save the HTML code, given above as IFrame.HTML on your machine.

2) Next, you must provide the correct path in the placeholder given in the above snippet. You must use forward slash while specifying the file-path of the web page. Otherwise, it may not work accurately. For example, here I have given the path of the file as.

location = "file://C:/Users/Automation-Dev/Desktop/selenium/IFrame.HTML"

3) In Section-1 of the code,

seq= driver.find_elements_by_tag_name('iframe')

provides the list of IFrames present on the web page.

4) We do the switching between the IFrames by traversing through this list using the following step.

 iframe = driver.find_elements_by_tag_name('iframe')[index]

 driver.switch_to.frame(iframe)

5) Every time you need to move back from an IFrame to the parent HTML. Selenium webdriver provides the following method.

driver.switch_to.default_content()

6) In Section-2, we switch to a specific IFrame using the locator as ‘id.’

 iframe = driver.find_element_by_id('FR1')

7) n Section-3, we switch to a specific IFrame using the locator as ‘name.’

iframe = driver.find_element_by_name('frame2')

Quick Wrapup – Switch Between IFrames

It is essential to understand how to use Selenium Python to switch between IFrames. You can re-use this technique to solve real-time use cases in your projects.

For more updates on Selenium Python tutorials, do follow our social media (Facebook/Twitter) accounts.

Best,

TechBeamers