Let's now see how we can handle switching between the frames of a web page. In the HTML files supplied with this book, you will see a file named Frames.html. If you open that, you will see two HTML files loaded in two different frames. Let's see how we can switch between them and type into the text boxes available in each frame:

public class FrameHandlingTest {
    WebDriver driver;

    @BeforeMethod
    public void setup() throws IOException {
        System.setProperty("webdriver.chrome.driver",
                "./src/test/resources/drivers/chromedriver");
        driver = new ChromeDriver();
        driver.get("http://guidebook.seleniumacademy.com/Frames.html");
    }

    @Test
    public void switchBetweenFrames() {

        // First Frame
        driver.switchTo().frame(0);
        WebElement firstField = driver.findElement(By.name("1"));
        firstField.sendKeys("I'm Frame One");
        driver.switchTo().defaultContent();

        // Second Frame
        driver.switchTo().frame(1);
        WebElement secondField = driver.findElement(By.name("2"));
        secondField.sendKeys("I'm Frame Two");
    }

    @AfterMethod
    public void tearDown() {
        driver.quit();
    }
}

In the preceding code, we have used switchTo().frame instead of switchTo().window because we are moving across frames.

The API syntax for frame is as follows:

WebDriver frame(int index)

This method takes the index of the frame that you want to switch to. If your web page has three frames, WebDriver indexes them as 0, 1, and 2, where the zero index is assigned to the first frame encountered in the DOM. Similarly, you can switch between frames using their names by using the previous overloaded method. The API syntax is as follows:

WebDriver frame(String frameNameOrframeID)

You can pass the name of the frame or its ID. Using this, you can switch to the frame if you are not sure about the index of the target frame. The other overloaded method is as follows:

WebDriver frame(WebElement frameElement)

The input parameter is the WebElement of the frame. Let's consider our code example: First, we have switched to our first frame and typed into the text field. Then, instead of directly switching to the second frame, we have come to the main or default content and then switched to the second frame. The code for that is as follows:

driver.switchTo().defaultContent();               

This is very important. If you don't do this and try to switch to the second frame while you are still in the first frame, your WebDriver will complain, saying that it couldn't find a frame with index 1. This is because the WebDriver searches for the second frame in the context of the first frame, which is obviously not available. So, you have to first come to the top-level container and switch to the frame you are interested in.

After switching to the default content, you can now switch to the second frame using the following code:

driver.switchTo().frame(1);

Thus, you can switch between the frames and execute the corresponding WebDriver actions.