Locating table rows and cells

While working with tables, we can locate the rows and cells effectively by using a set of the By class methods.

In this recipe, we will see how to locate rows and columns in table.

How to do it...

Let's create a simple test that will print data from a table, locating its rows and columns as follows:

@Test
public void testTable() { 
    
    WebElement simpleTable = driver.findElement(By.id("items"));
    
    //Get all rows
    List<WebElement> rows = simpleTable.findElements(By.tagName("tr"));
    assertEquals(3, rows.size());
    
    //Print data from each row
    for (WebElement row : rows) {
        List<WebElement> cols = row.findElements(By.tagName("td"));
        for (WebElement col : cols) {
            System.out.print(col.getText() + "\t");
        }
        System.out.println();
    }
}

How it works...

A table in HTML is a collection of <tr> and <td> elements for rows and cells, respectively. In the sample test, the table can be located as a WebElement using its ID as follows:

WebElement simpleTable = driver.findElement(By.id("items"));

To get all the rows from a table, the findElements() method is called on simpleTable and the tagName strategy is used to get all <tr> elements. These are rows of a table.

List<WebElement> rows = simpleTable.findElements(By.tagName("tr"));

Each <tr> element then holds the <td> elements, which are the columns or cells of the table. The test iterates through the row and columns to print the data in the following way:

//Print data from each row
for (WebElement row : rows) {
    List<WebElement> cols = row.findElements(By.tagName("td"));
    for (WebElement col : cols) {
        System.out.print(col.getText() + "\t");
    }
    System.out.println();
}

This method comes in handy when you have a test that needs to verify data in a table.

There's more…

We can also use CSS selectors or XPath for locating table rows and cells using index matching. In the following example, CSS selector is used to locate the first cell of the second row in the table:

WebElement cell = driver.findElement(By.cssSelector("table#items tbody tr:nth-child(2) td"));

Similarly using XPath, it can be done in the following way:

WebElement cell = driver.findElement(By.xpath("//table[@id='items']/tbody/tr[2]/td"));

See also

• The Locating child elements in a table recipe

• The Locating elements using FindElements method recipe