How to Steer Frame in Selenium

2022-02-25

Switch to frame

Select a frame by its (zero-based) index

driver.switchTo().frame(int index)

Select a frame by its name or ID

driver.switchTo().frame(String nameOrId)

Select a frame by WebElement

driver.switchTo().frame(WebElement frameElement)

Change focus to the parent context. If the current context is the top level browsing context, the context remains unchanged

driver.switchTo().parentFrame();

Selects either the first frame on the page, or the main document when a page contains iframes

driver.switchTo().defaultContent();

Once we have switched to a frame, will need to switch to parent frame frist, and then switch to another frame under the same parent

Example

Code

    @Test
    public void testNestedFrame() {

        driver.get("http://the-internet.herokuapp.com/nested_frames");
        List<WebElement> frames = driver.findElements(By.cssSelector("frameset frame"));
        System.out.println("frame size " + frames.size());
        PrintText("parent - div#content text",By.cssSelector("div#content"));
        PrintAttrValue("parent - html", By.cssSelector("html"),"textContent");

        driver.switchTo().frame("frame-top");
        PrintText("frame-top - div#content text",By.cssSelector("div#content"));
        PrintAttrValue("frame-top - html", By.cssSelector("html"),"textContent");

        driver.switchTo().frame("frame-middle");
        PrintText("frame-middle - div#content text", By.cssSelector("div#content"));
        PrintAttrValue("frame-middle - html", By.cssSelector("html"),"textContent");

        //driver.switchTo().frame("frame-bottom");   //Error: No frame element found by name or id frame-bottom

        driver.switchTo().parentFrame();
        driver.switchTo().frame("frame-left");
        PrintText("frame-left - body text", By.cssSelector("body"));
        PrintAttrValue("frame-left - html", By.cssSelector("html"),"textContent");

        driver.switchTo().defaultContent();
        PrintAttrValue("frame first html", By.cssSelector("html"),"textContent");
        driver.switchTo().frame("frame-bottom");
        PrintText("frame-bottom - body text", By.cssSelector("body"));
        PrintAttrValue("frame-bottom - html", By.cssSelector("html"),"textContent");

    }

    public void PrintAttrValue(String str, By locator, String attr)
    {
        try
        {
            System.out.println(str + ": "+ driver.findElement(locator).getAttribute(attr).replaceAll("\n",""));
        }
        catch (Exception ex)
        {
            System.out.println(str + ": "+ex.getMessage().lines().findFirst());
        }
    }

    public void PrintText(String str, By locator)
    {
        try
        {
            System.out.println(str + ": "+ driver.findElement(locator).getText());
        }
        catch (Exception ex)
        {
            System.out.println(str + ": "+ex.getMessage().lines().findFirst());
        }
    }

Output

frame size 2
parent - div#content text: Optional[no such element: Unable to locate element: {"method":"css selector","selector":"div#content"}]
parent - html:           Frames are not rendering.  
frame-top - div#content text: Optional[no such element: Unable to locate element: {"method":"css selector","selector":"div#content"}]
frame-top - html:       
frame-middle - div#content text: MIDDLE
frame-middle - html:                 MIDDLE    
frame-left - body text: LEFT
frame-left - html:             LEFT    
frame first html:           Frames are not rendering.  
frame-bottom - body text: BOTTOM
frame-bottom - html: BOTTOM