Frames are HTML pages that are used inside the main HTML tags. A frame is an HTML tag written as <frame>. It is used to divide the web page into various sections. It specifies each frame within the <frameset> tag. Iframes or Inline frames is written as <iframe>and this is also another tag in HTML, but it is used to embed some other document into the current HTML document. The method to handle frames and iframes in Selenium is the same. We will only see how to handle frames here.
Refer to the FramesDemo.html given in the following code:
<!DOCTYPE html>
<html>
<frameset cols="25%,50%,*">
<frame name="frame1" src="C:Frame1.html">
<frame name="frame2" src="C:Frame2.html">
<frame name="frame3" src="C:Frame3.html">
</frameset>
</html>
The code for Frame1.html is given in the following code:
<!DOCTYPE html>
<html>
<body>
<h1>Frame 1</h1>
<p>Contents of Frame 1</p>
<p><input type="radio" id="radio1"/></p>
</body>
</html>
The code for Frame2.html is given in the following code:
<!DOCTYPE html>
<html>
<body>
<h1>Frame 2</h1>
<p>Contents of Frame 2</p>
<p><input type="text" id="input1"/></p>
</body>
</html>
The code for Frame3.html is given in the following code:
<!DOCTYPE html>
<html>
<body>
<h1>Frame 3</h1>
<p>Contents of Frame 3</p>
<p><input type="checkbox" id="chk1"/></p>
</body>
</html>
The following is the code to handle elements in three frames:
WebDriver driver = new ChromeDriver();
driver.navigate().to("C:\FramesDemo.html");
driver.switchTo().frame(0);
System.out.println(driver.findElement(By.tagName("body")).getText());
driver.findElement(By.id("radio1")).click();
driver.switchTo().defaultContent();
driver.switchTo().frame("frame2");
driver.findElement(By.id("input1")).sendKeys("input box");
driver.switchTo().defaultContent();
driver.switchTo().frame("frame3");
driver.findElement(By.id("chk1")).click();
In the preceding code, it can be seen that to click each of the web elements, we have to issue a command: driver.switchTo.Frame(int) or driver.switchTo.Frame(String).
We have taken the examples of integer and string parameters. We pass the index as the integer parameter or the name of the frame as the string parameter. Whenever we issue this command, control goes to that particular frame and we can only access web elements inside that frame.
If there are nested frames inside a particular frame, the first navigation has to be to the container or parent frame followed by navigation to the child frame. If there are parallel frame hierarchies, as in the preceding example, one has to issue driver.switchTo.defaultContent() to get to the outermost frame if the control is currently in one particular frame and a web element in another parallel frame has to be clicked. If driver.switchTo.defaultContent() is not issued before accessing a parallel frame hierarchy, then a NoSuchFrameException, provided the control is in another frame at that moment. This exception is primarily thrown when a frame does not exist.