Tuesday 14 May 2013

Working on Iframes with selenium

While working with different automation team members, I have observed that people are facing lot of challenges when they start working on UI with multiple iframes.here I tried to document my personal experience about handling iframes with selenium.

If you are beginner in automating UI having frames/ iframes, then please make a note that selenium doesn’t recognize any object from a frame, unless you attach the selenium control to respective frame.
I have listed few scenarios where automated test can stuck :


Scenario 1:
How to attach the control to iframe with selenium webdriver :
        driver.switchTo().frame(frameID or any other unique attribute of frame);
Above code will take care of attaching to frame after that you can identify any objects from the frame using the same way you are identifying the objects from webpage.
                  driver.switchTo().defaultContent();

Scenario 2:
If I have two independent Iframe (FrameID1 and frameID2) how to work on these two frames
driver.switchTo().frame(frameID1);
<perform the operation on frame1>
:
:
:
<Now if you have to work on controls from frame2 then >
driver.switchTo().defaultContent();
driver.switchTo().frame(frameID2);

Scenario 3:
If I have childFrame inside the parentFrame how to work on child frame . Refer below HTML for detail understanding

<frame name="Frame1" id="parentFrameID">
        -----------
            <frame name="Frame2" id="childFrameID1">
        -----------
   
            </frame>
<frame name="Frame2" id="childFrameID2">
        -----------
   
            </frame>

 </frame>

In this case, you cannot directly attach to childFrameID,first switchTo parentFrame inside which childframeis is placed then look for required child frame.
            driver.switchTo().defaultContent();
            driver.switchTo().frame("parentFrameID");
            driver.switchTo().frame("childFrameID1");


How to switch from parent frame from one childframe ?
you cannot toggle directly between child frame just by switching from one child frame to another child frame, refer below code

            driver.switchTo().defaultContent();
            driver.switchTo().frame("parentFrameID");
            driver.switchTo().frame("childFrameID1");
            //now as you have to switch for a childframe2 then
            driver.switchTo().defaultContent();
            driver.switchTo().frame("parentFrameID");
            driver.switchTo().frame("childFrameID2");

You can also switch to child frame using its index
 
driver.switchTo().frame(indexoftheframe);
                         
index starts from ‘0’
  
Believe me, there are many more scenarios related to frames that supposed to be handle in this post but for now I want to keep it simple.
Please feel free to discuss if you are facing any other challenge which I haven’t mentioned here. we can surely extend this post to resolve your creepy  issues related to iframe with selenium.