Netscape Navigator 2.0 introduced the frame concept in HTML in the year 1996. Every Selenium automation tester should be familiar with frameset and iframe. Now frameset is obsolete; it has been removed due to security, usability, and accessibility issues when HTML5 was introduced in the early 2000s.
However, web developers still use iFrame to embed documents, videos, and interactive media on a webpage.
What is iFrame?
iFrame allows embedding another website’s content on the current page without being redirected. Nowadays, the use of iframe is not a good idea due to security, usability, and SEO factors.
In the past, most websites/web-applications used frames for advertising and tracking. However, now it is considered a bad practice. As an automation testing company, our comment on iFrame is like a GOTO statement in a programming language, which every programmer ignores. If iframe is unavoidable and you know how to use iframe properly without exploiting the web standards, then you can go ahead.
Handling iFrame using Selenium
To identify and interact with the elements which are inside the iFrame, you need to switch to the iframe first, and then you can play-around with the frame’s elements. Below is the sample HTML for an iFrame.
<iframe id="fram1" src="sample-2.html" title="description" />
Selenium code to switch to iFrame.
driver.switchTo().frame("fram1");
Once the webdriver instance has focused the frame, you can access all the available elements inside the iframe. If your script has completed the required interactions and validations in the frame, you need to switch back to the page document to proceed with further actions on the document’s top level. To interact with the main document, you need to use ‘switchTo(). defaultContent()’ method.
driver.switchTo().defaultContent();
Identifying iFrames
You can identify iframe using its name or id.
Iframe with ID attribute:
<iframe id="fram1" src="sample-2.html" title="description" />
Iframe with Name attribute:
<iframe name="fram2" src="sample-2.html" title="description" />
driver.switchTo().frame("fram1"); driver.switchTo().frame("fram2");
If you want to identity by index, refer to the below code. The code selects the first frame on the page.
driver.switchTo().frame(0);
Focusing Parent Frame
Let’s say the focused frame has a child iframe, and you want to interact with the elements in the child frame. Then, the script can traverse further to the child frame and perform the validations. Once the script has completed the interactions, it can switch back to the parent frame using ‘switchTo. parentFrame()’ method.
driver.switchTo().parentFrame();
In Conclusion:
Our automation testers are expertise in test automation services. We, at Codoid, train the testers from basics topics in automation testing. If you know when and how to use iframe in a web application, you can guide your team on the usage of iframe. Please avoid frames.
We hope that you have enjoyed reading this blog article. In the coming weeks, we will be publishing more articles on Selenium basic with detailed insights. If you have a good automation testing team, it will produce awesome automated test suites.
Comments(0)