A Guide to Handling a WebTable in Selenium Webdriver

Last Updated : 30 Sep, 2024

A Dynamic web table is a type of web table where the number of rows and columns are not constant, they keep changing from time to time depending on the requirements or based on the query, i.e. Number of rows and columns is NOT fixed.

What is a WebTable in Selenium?

A WebTable in Selenium refers to an HTML table that contains structured data, typically organized in rows and columns. Selenium allows users to interact with these tables by locating elements based on their attributes, such as tags, classes, or IDs, enabling actions like extracting data, clicking on links within the table, or validating content. Handling WebTables often involves using methods to traverse rows and cells, making it crucial for testing applications that rely on tabular data.

What are the Two Main Types of WebTables in Selenium?

In Selenium, the two main types of WebTables are:

Static WebTable

Static WebTables have a fixed structure and content that doesn't change after the page loads. The data is predefined, allowing for straightforward extraction and interaction since the number of rows and columns remains constant. Testing involves simply locating elements and retrieving values without concern for changes in the table’s structure.

Dynamic WebTable

Dynamic WebTables, on the other hand, can change based on user interactions or data updates, such as sorting, filtering, or pagination. This type requires more complex handling because the number of rows, columns, or even the data within them can vary. Selenium scripts need to account for these changes, often involving methods to wait for elements to load or to interact with controls that modify the table's content.

Handling WebTables in Selenium (For both static and Dynamic)

Handling Dynamic Table in Selenium

The below table is a dynamic web table and the HTML code for the table, This table does not contain even an arrangement of rows and columns the last row has two columns, but the other has 4 columns.

HTML

<html>    <head>       <style></style>    </head>    <body>       <table name="Table">          <tr>             <th>BookName</th>             <th>Author</th>             <th>Subject</th>             <th>Price</th>          </tr>          <tr>             <td>Learn Selenium</td>             <td>John</td>             <td>Selenium</td>             <td>100</td>          </tr>          <tr>             <td>Learn Java</td>             <td>Joey</td>             <td>Java</td>             <td>500</td>          </tr>          <tr>             <td>Learn JS</td>             <td>Chandler</td>             <td>Javascript</td>             <td>700</td>          </tr>          <tr>             <td>Master In Selenium</td>             <td>Ross</td>             <td>Selenium</td>             <td>1000</td>          </tr>          <tr>             <td>Master In Java</td>             <td>Mike</td>             <td>JAVA</td>             <td>2000</td>          </tr>          <tr>             <td>Master In JS</td>             <td>Rachel</td>          </tr>       </table>    </body> </html>

Save the code as “.html”, then you will get an HTML table like below.

Example for fetch no. of rows and columns from Dynamic Table

The main problem that occurs during working with the Dynamic table is, that we cannot predict the number of rows and columns. So in this example, we will use the Selenium web driver to find the number of rows and columns. For computing the number of rows and columns, we require the Xpath of the web table.

Find the X-Path of the Table:

Go to the website, Right-click on the table, and select inspect and copy the x-path.

X-Path for Columns:

/html/body/table/tbody/tr[1]/th

X-Path for Rows:

/html/body/table/tbody/tr/td[1]

Program

Java

import java.util.List; import org.openqa.selenium.By; import org.openqa.selenium.WebElement; import org.openqa.selenium.chrome.ChromeDriver; import org.testng.annotations.Test;  public class Geeks {      String columnXpath = "/html/body/table/tbody/tr[1]/th";     String rowXpath = "/html/body/table/tbody/tr/td[1]";     @Test public void geeksforgeeks()     {         // Please note that with Selenium 4.6.0 version, a         // new feature is added called Selenium Manager With         // Selenium Manager there is no need to use any         // driver, rather Selenium can handle itself.         System.setProperty(             "webdriver.chrome.driver",             "C:\\Users\\ADMIN\\Documents\\chromedriver.exe");         ChromeDriver driver = new ChromeDriver();          // Maximize the browser         driver.manage().window().maximize();          // Launch Website         driver.get(             "file:///C:/Users/ADMIN/Desktop/table.html");          // Number of columns         List<WebElement> col             = driver.findElements(By.xpath(columnXpath));         System.out.println("No of columns : " + col.size());          // Number of rows         List<WebElement> rows             = driver.findElements(By.xpath(rowXpath));         System.out.println("No of rows : " + rows.size());         driver.close();     } }

Code Explanation:

We declared the selenium web driver object "driver" initialized it to chrome driver, and used the 'List<webelement>' list of web element datatype to find the number of columns and rows.

To set up the chrome driver using selenium refer to this article How to open chrome browser using Selenium in Java

Output:

Conclusion

Handling WebTables in Selenium WebDriver is a fundamental skill for automating web applications that present data in tabular format. Understanding the differences between static and dynamic tables allows testers to apply appropriate strategies for data extraction, interaction, and validation.

For static WebTables, the simplicity of their fixed structure enables straightforward element identification and data manipulation. In contrast, dynamic WebTables require a more nuanced approach due to their changing nature, necessitating the use of explicit waits and careful navigation through pagination or filtering.

Implementing best practices, such as modular code and robust error handling, enhances the reliability and maintainability of your test scripts. By mastering these techniques, you can effectively automate interactions with WebTables, ensuring comprehensive testing of applications that rely on structured data. This not only improves efficiency in testing but also contributes to delivering high-quality software that meets user expectations.

Selenium WebDriver-Handling Alerts

allwink45

Improve

Article Tags :

Practice Tags :

Java