DZone
Thanks for visiting DZone today,
Edit Profile
  • Manage Email Subscriptions
  • How to Post to DZone
  • Article Submission Guidelines
Sign Out View Profile
  • Post an Article
  • Manage My Drafts
Over 2 million developers have joined DZone.
Log In / Join
Please enter at least three characters to search
Refcards Trend Reports
Events Video Library
Refcards
Trend Reports

Events

View Events Video Library

Zones

Culture and Methodologies Agile Career Development Methodologies Team Management
Data Engineering AI/ML Big Data Data Databases IoT
Software Design and Architecture Cloud Architecture Containers Integration Microservices Performance Security
Coding Frameworks Java JavaScript Languages Tools
Testing, Deployment, and Maintenance Deployment DevOps and CI/CD Maintenance Monitoring and Observability Testing, Tools, and Frameworks
Culture and Methodologies
Agile Career Development Methodologies Team Management
Data Engineering
AI/ML Big Data Data Databases IoT
Software Design and Architecture
Cloud Architecture Containers Integration Microservices Performance Security
Coding
Frameworks Java JavaScript Languages Tools
Testing, Deployment, and Maintenance
Deployment DevOps and CI/CD Maintenance Monitoring and Observability Testing, Tools, and Frameworks

Last call! Secure your stack and shape the future! Help dev teams across the globe navigate their software supply chain security challenges.

Modernize your data layer. Learn how to design cloud-native database architectures to meet the evolving demands of AI and GenAI workloads.

Releasing software shouldn't be stressful or risky. Learn how to leverage progressive delivery techniques to ensure safer deployments.

Avoid machine learning mistakes and boost model performance! Discover key ML patterns, anti-patterns, data strategies, and more.

Related

  • Required Capabilities in Self-Navigating Vehicle-Processing Architectures
  • Java: Why a Set Can Contain Duplicate Elements
  • What Is Ant, Really?
  • Overview of C# Async Programming

Trending

  • Beyond Linguistics: Real-Time Domain Event Mapping with WebSocket and Spring Boot
  • Streamlining Event Data in Event-Driven Ansible
  • Mastering Fluent Bit: Installing and Configuring Fluent Bit on Kubernetes (Part 3)
  • Building Enterprise-Ready Landing Zones: Beyond the Initial Setup
  1. DZone
  2. Testing, Deployment, and Maintenance
  3. DevOps and CI/CD
  4. Handling iFrame Issues With Katalon Studio

Handling iFrame Issues With Katalon Studio

This tutorial will show you how to handle iframes when testing your websites using the Katalon Studio testing framework.

By 
Oliver Howard user avatar
Oliver Howard
·
Oct. 26, 17 · Tutorial
Likes (5)
Comment
Save
Tweet
Share
9.6K Views

Join the DZone community and get the full member experience.

Join For Free

A very common type of control used in websites is the HTML iframe, and this control needs to be handled in a specific manner when testing. This article shows you how to handle iframes properly in Katalon Studio.

What Is Iframe?

An iframe (Inline Frame) is an HTML document embedded in another HTML document. The iframe HTML element is often used to insert the content from another source, such as an advertisement, into a web page.

Why Is It Important to Know How to Test Iframes?

Verifying text and objects within iframes can be a challenge. For example, even though you can see a text displayed in an iframe, automation tools may not be able to detect the text. You have to tell your script how to traverse through a website’s iframes structure and select the correct iframe where the text and its object are present.

Example #1

1. Given that you want to capture the Comment text field of a certain question in Katalon Forum (this text field is an iframe), you can use the Web Object Spy of Katalon and see that it can detect the iframe in the red highlighted area.

iframe issue

2. Once the Comment iframe is captured, Katalon shows all of its child elements which you can see in the Object Spy dialog below:

Object Spy dialog

3. As you save the captured object to Katalon Studio, its iframe is also included. This is illustrated in the following screenshot:

Captured object to Katalon Studio

4. Then, you can proceed to set the text to the Comment field by specifying the child element for the Set Text keyword, as described below:

Set the text to the Comment field

Example #2

1. Given that you want to capture the JQueryUI’s Drag and Drop example (this draggable control is an iframe), as shown in the screenshot below, you can drag the ‘Drag me around’ object to other areas of the iframe.

capture the JQueryUI's Drag and Drop example

2. Use the Object Spy to capture the iframe as usual. The Object Spy can detect, capture the iframe, and show all of the iframe’s elements accordingly.

Object Spy to capture the iframe

3. As you save the captured object to Katalon Studio, the iframe is also included as the object’s parent element. This is illustrated in the following screenshot (Note that you can uncheck the option to use parent iframe if needed):

save the captured object to Katalon Studio

4. Given the situation where you opt not to specify the iframe parent for an element, in order to interact with the element, you need to use the keyword Switch To Frame to have Katalon focus on the parent iframe before being able to interact with the element.

The sample code below shows how to switch to the parent frame before using the drag and drop action on the elements within the iframe:

how to switch to the parent frame before using the drag and drop action

import com.kms.katalon.core.annotation.SetUp as SetUp

import com.kms.katalon.core.annotation.TearDown as TearDown

import com.kms.katalon.core.model.FailureHandling as FailureHandling

import com.kms.katalon.core.testobject.ObjectRepository as ObjectRepository

import com.kms.katalon.core.mobile.keyword.MobileBuiltInKeywords as Mobile

import com.kms.katalon.core.webservice.keyword.WSBuiltInKeywords as WS

import static com.kms.katalon.core.testobject.ObjectRepository.findTestObject

import static com.kms.katalon.core.testdata.TestDataFactory.findTestData

import static com.kms.katalon.core.testcase.TestCaseFactory.findTestCase

import com.kms.katalon.core.testcase.TestCase as TestCase

import com.kms.katalon.core.testdata.TestData as TestData

import com.kms.katalon.core.testobject.TestObject as TestObject

import com.kms.katalon.core.webui.keyword.WebUiBuiltInKeywords as WebUiBuiltInKeywords

import com.kms.katalon.core.webui.keyword.WebUiBuiltInKeywords as WebUI

import internal.GlobalVariable as GlobalVariable

'Open browser and navigate to jQuery UI page'
WebUI.openBrowser('http://jqueryui.com/')

'Maximize current browser window'
WebUI.maximizeWindow()

'Click on \'Draggle\' link'
WebUI.click(findTestObject('Page_jQuery_Homepage/lnk_Draggable'))

'Switch to iframe of Demo panel'

WebUI.switchToFrame(findTestObject('Page_jQuery_Drag and Drop Example/ifr_Demo Frame'),

GlobalVariable.G_Timeout_Small, FailureHandling.STOP_ON_FAILURE)

'Drag and drop iframe into other position'

WebUI.dragAndDropByOffset(findTestObject('Page_jQuery_Drag and Drop Example/div_Frame_Draggable'),

200, 38)

'Switch back to current window'

WebUI.switchToDefaultContent()

'Click on \'Droppable\' link'

WebUI.click(findTestObject('Page_jQuery_Homepage/lnk_Droppable'))

'Switch to iframe of Demo panel'
WebUI.switchToFrame(findTestObject('Page_jQuery_Drag and Drop Example/ifr_Demo Frame'),

GlobalVariable.G_Timeout_Small, FailureHandling.STOP_ON_FAILURE)

'Drag the left rectangle and Drop it the right-side one'
WebUI.dragAndDropToObject(findTestObject('Page_jQuery_Drag and Drop Example/div_Frame_Draggable'),

findTestObject('Page_jQuery_Drag and Drop Example/div_Frame_Droppable'), FailureHandling.STOP_ON_FAILURE)

WebUI.closeBrowser()

Common Exceptions

Note that NoSuchFrameException or InvalidSwitchToTargetException exceptions are thrown when the target frame to be switched to doesn’t exist.

Discover more tutorials about automation testing tools, please visit Katalon Tutorials.

IFrame (video format) Katalon Studio Object (computer science) Element code style

Opinions expressed by DZone contributors are their own.

Related

  • Required Capabilities in Self-Navigating Vehicle-Processing Architectures
  • Java: Why a Set Can Contain Duplicate Elements
  • What Is Ant, Really?
  • Overview of C# Async Programming

Partner Resources

×

Comments
Oops! Something Went Wrong

The likes didn't load as expected. Please refresh the page and try again.

ABOUT US

  • About DZone
  • Support and feedback
  • Community research
  • Sitemap

ADVERTISE

  • Advertise with DZone

CONTRIBUTE ON DZONE

  • Article Submission Guidelines
  • Become a Contributor
  • Core Program
  • Visit the Writers' Zone

LEGAL

  • Terms of Service
  • Privacy Policy

CONTACT US

  • 3343 Perimeter Hill Drive
  • Suite 100
  • Nashville, TN 37211
  • support@dzone.com

Let's be friends:

Likes
There are no likes...yet! 👀
Be the first to like this post!
It looks like you're not logged in.
Sign in to see who liked this post!