How to Handle IFrames in Selenium

This article explains how to identify and count the number of iframes (inline frames) present on a webpage using Selenium WebDriver. Two methods are used:

Locating all <iframe> elements on the page using the find_elements method.
Executing JavaScript to dynamically calculate the number of frames.

An iFrame, or inline frame, is an HTML element that allows you to embed content from another source into a web page. iFrames are used to display content from other websites, such as videos, maps, advertisements, and social media feeds, directly on a web page.

Below is the snippet of the HTML code being used

File: iframe.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Simple IFrames Example</title>
</head>
<body>
    <h1>Simple IFrames Example</h1>
    
    <h2>Main Page Content</h2>
    <p>This is the main page content.</p>
    
    <!-- First iframe -->
    <iframe src="iframe1.html" name="iframe1" width="400" height="200" style="border: 1px solid black;"></iframe>
    
    <br><br>
    
    <!-- Second iframe -->
    <iframe src="iframe2.html" name="iframe2" width="400" height="200" style="border: 1px solid black;"></iframe>
</body>
</html>

File iframe1.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>IFrame 1</title>
</head>
<body>
    <h2>IFrame 1: Greetings</h2>
    <p>Hello from IFrame 1!</p>
</body>
</html>

File: iframe2.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>IFrame 2</title>
</head>
<body>
    <h2>IFrame 2: Message</h2>
    <p>Welcome to IFrame 2!</p>
</body>
</html>

2. Create a Python file

Import the necessary libraries
Create an instance of the browser
Navigate to the target URL

3. Finding all iframe elements using the <iframe> tag

Used the find_elements with the tag name “iframe” to locate all iframe elements on the page and print the total count of iframe elements.

4. Using JavaScript to count the number of frames

Executed the JavaScript (return window.length) to calculate the number of frames dynamically present in the DOM, converted the result to an integer and printed the number.

And finally close the browser.

Final code

from selenium import webdriver
from selenium.webdriver.common.by import By

# Initialize WebDriver for Chrome
driver = webdriver.Chrome()

try:
    # Navigate to the URL containing iFrames
    driver.get("http://127.0.0.1:5500/iframe.html")

    # Find all iframe elements using the <iframe> tag
    iframe_elements = driver.find_elements(By.TAG_NAME, "iframe")
    print("Total number of iframes are:", len(iframe_elements))

    # Use JavaScript to count the number of frames
    # Execute the JavaScript: "return window.length"
    no_of_frames = int(driver.execute_script("return window.length"))
    print("Number of iframes on the page are:", no_of_frames)

finally:
    # Close the browser
    driver.quit()

Output