Handling HTML Tables in Selenium Webdriver

HTML tables are most often used to represent information on a web page. And Software testers can use Selenium Webdriver for accessing tables and reading data at runtime. In this post, we’ll tell you multiple ways for handling HTML tables in Webdriver. We will cover static tables, nested tables, and dynamic tables so that you can understand the concept thoroughly.

To help you out, we’ve added code examples for each method given here to handle the web tables. So that you can start practicing them even while you are reading this post. But apart from the Selenium Webdriver commands, you must also know how to use XPath to locate any element in the web table. Here is a list of quick links to run you through the different section of this post.

1- Step by step process of determining XPath for a cell in the web table.
2- How to access Nested tables in Selenium Webdriver?
3- How to handle Dynamic tables in Selenium Webdriver?

So let’s begin to learn the best ways out for handling HTML tables.

1- Handling HTML Tables in Selenium Webdriver.

Generally, there is an <id> or <name> attribute associated with all the HTML fields. And that becomes a unique identifier for locating the element on the web page.

But it isn’t the way that you can apply on a table for accessing its cells. Not even you can use methods that you normally do with Selenium like <By.id()>, <By.name()>, and <By.cssSelector()> to find a web element. Rather you should go with the <XPath> locator and <By.xpath()> method for handling HTML tables and cells.

1.2- Step by step process of determining XPath for a cell in the web table.

It’s essential for you to learn about XPath. It’ll help you in handling HTML tables and accessing web elements. First of all, consider the following HTML code.


We will use the XPath locator to get the inner text of cell containing the text “cell four”.

1- Handling HTML Tables in Selenium Webdriver

1- Read cell text.

Let’s find out the XPath for cell no. four.

Step 1 – Set the Parent Element (table).

XPath locators in WebDriver always start with a double forward slash “//” followed by the parent element tag. Since we are dealing with tables, the parent element should always be the <table> tag. The first portion of our XPath locator should start with the “//table”.

Step 2 – Add the child elements.

The element immediately under <table> tag is <tbody> so we can say that <tbody> is the “child” of <table>. And also, <table> is the “parent” of <tbody>.

4- Handling HTML Tables in Selenium Webdriver

2- Table structure.

While forming an XPath, you need to place all child elements to the right of their parent element. And please remember to use a forward slash to chain the elements.

2- Handling HTML Tables in Selenium Webdriver

3- Parent-child relation.


Step 3 – Add Predicates.

The <tbody> element contains two <tr> tags. We can now say that these two <tr> tags are “children” of <tbody>. Other way round <tbody> is parent of both the <tr> elements.

The two <tr> elements having same parent <tbody> can be called as siblings. Thus Siblings refer to child elements having the same parent.

To access the <td> (the one with the text “cell four”), we have to first go to the second <tr> and not the first. If we simply write “//table/tbody/tr”, then we will be accessing the first <tr> tag.

So, how to access the second <tr> then? The answer to this is to use Predicates.

Predicates represent the index of HTML child elements that are Siblings and are enclosed in a pair of square brackets “[ ]”. This index clearly distinguishes a child element from its siblings. Since the <tr> we need to access is the second one, so we’ll use “[2]” as the predicate.


If you don’t use any predicate, then XPath will always point to the first sibling. Hence, both of them should access the first <tr>.


The above code will automatically locate the first <tr> as no predicate is specified. But the below line will select the same row because the predicate value is “1”.


Step 4 – Add the Succeeding Child Elements Using the Appropriate Predicates.

In the previous steps, we’d reached to the second row. Next, we’ve to move to the second <td> element. Applying the same technique that we have used in steps 2 and 3, the XPath will come out to be the one shown below.


Using the above XPath locator, you can access the cell and obtain its inner text using the code below.


1.2- How to access Nested tables in Selenium Webdriver?

Nested tables are HTML tables defined within a table. For handling HTML tables you can try the same way as given above. Consider the below code.


To access the cell with the text “Electronic City” using the “//parent/child” and predicate concepts that we learned in the previous section, we get the following XPath.


Below is the complete Selenium WebDriver code for handling HTML tables and the text of the cell that we discussed.



1.3- How to handle Dynamic tables in Selenium Webdriver?

Accessing data from table becomes difficult in the following cases.

1- When table rows and columns change after loading the page.

2- When a table has some rows with more cells and some rows with fewer cells, then you need to refactor the code to handle this.

3- Handling HTML Tables in Selenium Webdriver

3- Inconsistent table.

1.3.1- HTML code for the above table is as follows.


Above HTML code forms a dynamic table with rows having inconsistent no. of cells. The logic to read data from such a table is to first move to a row of that table, then count the number of cells in that row and based on the number of cells retrieve data from a particular cell.

1.3.2- Sample Selenium Webdriver code for handling HTML tables.


Final Thought.

We suggest you try to practice the HTML and Java code given above. This is how you can get the maximum benefit from this tutorial. And if you face any problem while handling the HTML tables in Selenium webdriver project, then do write to us. We’ll try to get back at the earliest.

If you want us to write on a topic of your choice, then also contact us. We’ll surely add it to our interest list and deliver a post as soon as we can.




Leave a Reply