Wednesday 5 August 2015

How to handle iframe in selenium webdriver using java.

iFrame:
An iFrame (Inline Frame) is an HTML document embedded inside the current HTML document on a website. iFrame HTML element is used to insert content from another source, such as an advertisement, into a Web page. A Web designer can change an iFrame's content without making them reload the complete website. A website can have multiple frames on a single page.

<title> iFram Tutorial</title> 

   
    <div class="box"><iframe name="iframe1" id="IF1" height="400" width="400" src="http://espncricinfo.com"></iframe> 
    </div><h2>Alert Box</h2><fieldset><legend>Alert Box</legend><p>Click the button to display an alert box.</p><button onclick="alertFunction()">Alerts</button> 
  <script> 
  function alertFunction() 
  { 
  alert("I am an example for alert box!"); 
  } 
  </script> 
  </fieldset><div class="box"><iframe name="iframe2" id="IF2" height="400" width="400" align="left" src="http://alljerseymovers.com"></iframe> 
    </div> 

Step 1: To switch inside a frame

Switch to Frames by Index:
Index of an iFrame is the position at which it occurs in the HTML page. In the above example we have found total number of iFrames. In the sample page we have two IFrames, index of iFrame starts from 0. So there are two iFrames on the page with index 0 and 1.

driver.switchTo().frame(int iframnumber);//pass frame number as parameter. 
driver.switchTo().frame(0); 
Switch to Frames by Name:
Now if you take a look at the HTMLcode of iFrame you will find that it has Name attribute. Name attribute has a value iframe_name1.

driver.switchTo().frame(String frameName); //pass frame name as parameter. 
driver.switchTo().frame("iframe_name1"); 

Switch to Frame by ID:
Similar to the name attribute in the iFrame tag we also have the ID attribute. We can use that also to switch to the frame.

driver.switchTo().frame(String Id); //pass frame id as parameter. 
driver.switchTo().frame("iFram_id1"); 
Switch to Frame by Web Element:
iFrame by simply passing the iFrame WebElement to the driver.switchTo().frame() command. First find the iFrame element using any of the locator strategies and then passing it to switchTo command

driver.switchTo().frame(WebElement locator );  
driver.switchTo().frame(driver.findElement(By.id("iFram_id1"))); 


Step 2: After switching inside a frame selenium will be able to operate on elements.

driver.findElement(By.partialLinkText("Results")).click(); 
driver.findElement(By.xpath("/html/body/div[6]/div[2]/div[1]/section[1]/div[1]/ul/li[2]/a")).click(); 

Step 3: Switching back to Main page from Frame
There is one very important command that will help us to get back to the main page. Main page is the page in which two iFrames are embedded. Once you are done with all the task in a particular iFrame you can switch back to the main page using the 

switchTo().defaultContent().

driver.switchTo().defaultContent(); 

Example

import org.openqa.selenium.Alert; 
import org.openqa.selenium.By; 
import org.openqa.selenium.WebDriver; 
import org.openqa.selenium.firefox.FirefoxDriver; 
 
 
public class iFram { 
 
    public static void main(String[] args) throws InterruptedException { 
 
// Initialize Firefox Web driver    
WebDriver driver = new FirefoxDriver(); 
//Maximize browser window    
driver.manage().window().maximize(); 
//Go to Page   
driver.get("file:///C:/Users/Hiro%20Mia/Desktop/iFrame.html"); 
 
//Switch by Index 
driver.switchTo().frame(0); 
//operate web elements on iFram. 
driver.findElement(By.xpath("/html/body/div[6]/div[2]/div[1]/section[1]/div[1]/ul/li[2]/a")).click(); 
 
//Switch back to the main window 
driver.switchTo().defaultContent(); 
//operate web elements on Main window.  
driver.findElement(By.xpath("/html/body/fieldset/button")).click(); 
//handle to the open  confirmation popup.   
Alert Confirm = driver.switchTo().alert(); 
Thread.sleep(3000); 
//click on Cancel button.          
Confirm.dismiss(); 
//close browser          
driver.quit(); 
    } 
 

2 comments: