IFrame (FullForm: Inline Frame) is an HTML document that is included in another HTML document and is used to place the contents from another source. Eg: Advertisements, Youtube Videos etc…

Almost all site includes IFramenow a day, where they would be displaying advertisements or playing videos of other sources.

Now, let’s see how to identify and handling of IFrames in Selenium with C#.Net technology.

There are two ways to identify the <IFrames> in your web application:

1. When performed right click action on the element and if you can see an option called “This Frame”. This method is shown in below screenshot:

2. Go to Page source and search for “iframe”, if u can see a tag name by IFrame meaning that the page contains iframe. This method is shown in below screenshot:

NOTE: We cannot identify Frames using Firepath (or) Firebug.

We can switch to IFrameby using:

• Index
• ID (or) Name
• Web Element

We can switch to IFrame by using frames “Index”. Remember that “Index” always starts with ‘0’ for frames as like arrays.

Syntax: By using “Index”

driver.SwitchTo().Frame(int frameIndex);

Eg: Consider the below pagesource search 

The page consists of 6 frames and you want to SwitchTo 3 frame:

driver.SwitchTo().Frame(2);  //Index starts with ‘0’

We can switch to IFrame by using the frame attributes “ID (or) Name”.

Syntax: By using "ID / Name"

driver.SwitchTo().Frame(string frameID / Name);

Eg: Consider the below pagesource search

The frame has attribute called ID = “frmDev”;

driver.SwitchTo().Frame(“frmDev”);

Replace ID value with Name value if frame name is available.

We can switch to IFrame by using “WebElement.”

Syntax: By using "WebElement"

driver.SwitchTo().Frame(IWebElement element);

Eg: Consider the code for above diagram:

driver.SwitchTo().Frame(driver.FindElement(By.Id("frmDev")));

How to switch back to parent window from IFrame ?? After performing the desired actions on iframe??

We can switch back to parent window by using either of the following code:

//Selects either the first frame on the page or the main document when a page contains iFrames.

driver.SwitchTo().DefaultContent();

//Select the parent frame of the currently selected frame.

driver.SwitchTo().ParentFrame();

Identifying number of IFrame in the web page:

//Finding the number of frames in page using the tagname "iframe"

IList<IWebElement> frameCount = driver.FindElements(By.TagName("iframe"));

Console.WriteLine("IFrame count on web page: " + frameCount.Count);

Consider, you have multiple frames in your page, iframe has no “ID/Name/Index/WebElement” specified in its attributes and you want to perform Click operation on the element that is inside the IFrame . In this case, you first must get the count of number of iframes in your page, iterate through all frames to validate the presence of element. When element presence is found then get the index of that frame. Below is the code:

    class WebAutomation

    {

        [Test]

        public void handlingFrames()

        {

              //Instantiating the FireFox driver

              IWebDriver driver = new FirefoxDriver();

              //Navigatinf to eCanarys blogs page

             driver.Navigate().GoToUrl("https://www.ecanarys.com/Blogs/ArticleID/326/What-is-Synchronization-                                                                                        Handling-Synchronization-in-Selenium-WebDriver-using-C");

              //Maximize the window

              driver.Manage().Window.Maximize();

               //Finding the number of frames in page using the tagname "iframe"

 IList<IWebElement> frameCount = Driver.FindElements(By.TagName("iframe"));

               //Printing the frame count on console

               Console.WriteLine("IFrame count on web page: " + frameCount.Count);

               bool IsElementPresent = false;

               //Iterating through all the frames and check the presence of element

               for(int i=0; i<= frameCount.Count; i++)

               {

                              //Switch to frame

                              driver.SwitchTo().Frame(i);                  

                              //Identify the element. Here I'm identifying the element by ID

                              IWebElement locator = driver.FindElement(By.Id("elementID"));

                             //Check for element presence

                             if(locator.Displayed == true)

                             {

                                              IsElementPresent = true;

                                              //Get the index[i]

                                              Console.WriteLine("Index: " + i);

                                              break;

                              }

                          

//Switch to parent window

             driver.SwitchTo().DefaultContent();                      

               }           

               //killing the driver instance

               driver.Quit();

        }

    }

After executing this program you will have the frame index with you. Use the frame index to switch to IFrame and perform the desired operation. As per ex: considering element found in 3^rd frame:

//Switch to frame

 driver.SwitchTo().Frame(2);  //Index starts with ‘0’

        

//Identify the element. Here I'm identifying the element by ID

               IWebElement locator = driver.FindElement(By.Id("elementID"));

 

 //Perform Click operation

                locator.Click();

 

Handling of Nested <IFrames> is coming soon… 😊

Subscribe to our Newsletters to get updates whenever a new blog is updated….

Happy Framing And Happy Testing 😊