• Selenium Video Tutorials

Selenium Webdriver - Dynamic Web Tables

Selenium Webdriver can be used to handle dynamic web tables (tables having unequal number of rows and columns). In HTML terminology, every table is identified by the tagname called table. Also, each row in a table has the tagname as tr and the column will have a tagname as td. Finally, the column headers are identified by the th tagname.

Let us now discuss the identification of a table on a web page shown in the below image. First, we would need to right click on the webpage, and then click on the Inspect button in the Chrome browser. Then, the corresponding HTML code for the whole page would be visible. For investigating a single element on a page, we would need to click on the left upward arrow, available to the top of the visible HTML code as highlighted below.

Selenium Dynamic Web 1

Once we had clicked and pointed the arrow to the table (highlighted in the below image), its HTML code was visible, both reflecting the table tagname(enclosed in <>) along with along with tr, td, and th tag names for table rows, columns, and headers respectively.

Selenium Dynamic Web 2

The th tag names under the thead tag are for the column headers in the tables.

<thead>
   <tr>
      <th scope="col">First Name</th>
      <th scope="col">Last Name</th>
      <th scope="col">Age</th>
      <th scope="col">Email</th>
      <th scope="col">Salary</th>
      <th scope="col">Department</th>
      <th scope="col">Action</th>
   </tr>
</thead>
Selenium Dynamic Web 3

The td tag names under the tbody tag are for the cell values in the tables.

Selenium Dynamic Web 4

Let us take an example of the above table, where we would get all the cell values of the table having the tagname as td using the locator xpath for that table.

Syntax

Syntax to get all the cell data from a table.

Webdriver driver = new ChromeDriver();

// Locate the table element
WebElement table1 = driver.findElement(By.xpath("value of xpath"));

// Find all rows in the table then store in list
List<WebElement> r = table1.findElements(By.xpath(".//tr"));

// Looping through rows and get cell values
for (WebElement rw : r) {
   List<WebElement> cell = rw.findElements(By.xpath(".//td"));
   for (WebElement c : cell) {
      String value = c.getText();
      System.out.println("Cells values: " + value);
   }
}

Example

Code Implementation on HandlingWebTable.java class file.

package org.example;

import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;
import java.util.List;
import java.util.concurrent.TimeUnit;

public class HandlingWebTable {
   public static void main(String[] args) throws InterruptedException {

      // Initiate the Webdriver
      WebDriver driver = new ChromeDriver();

      // adding implicit wait of 15 secs 
      driver.manage().timeouts().implicitlyWait(15, TimeUnit.SECONDS);

      // Open the webpage to identify table
      driver.get("https://www.tutorialspoint.com/selenium/practice/webtables.php");
      
      // Locate the table element
      WebElement table1 = driver.findElement
         (By.xpath("/html/body/main/div/div/div[2]/form/div[2]/table"));

      // Find all rows in the table
      List<WebElement> r = table1.findElements(By.xpath(".//tr"));

      // Looping through rows and get cell values
      for (WebElement rw : r) {
         List<WebElement> cell = rw.findElements(By.xpath(".//td"));
         for (WebElement c : cell) {
            String value = c.getText();
            System.out.println("Cells values: " + value);
         }
      }

      // Closing browser
      driver.quit();
   }
}

Output

Cells values: Cierra
Cells values: Vega
Cells values: 39
Cells values: cierra@example.com
Cells values: 10000
Cells values: Insurance
Cells values: 
Cells values: Alden
Cells values: Cantrell
Cells values: 45
Cells values: alden@example.com
Cells values: 12000
Cells values: Compliance
Cells values: 
Cells values: Kierra
Cells values: Gentry
Cells values: 29
Cells values: kierra@example.com
Cells values: 2000
Cells values: Legal
Cells values: 
Cells values: Alden
Cells values: Cantrell
Cells values: 45
Cells values: alden@example.com
Cells values: 12000
Cells values: Compliance
Cells values: 
Cells values: Kierra
Cells values: Gentry
Cells values: 29
Cells values: kierra@example.com
Cells values: 2000
Cells values: Legal
Cells values:

Process finished with exit code 0

In the above example, we had captured all the cell values in the table.

Finally, the message Process finished with exit code 0 was received, signifying successful execution of the code.

Let us take an example of the same table, where we would get all the cell headers of the table having the tagname as th using the locator xpath for that table.

Syntax

Syntax to get all the cell headers from a table.

Webdriver driver = new ChromeDriver();
WebElement table1 = driver.findElement(By.xpath("value of xpath"));
List<WebElement> r = table1.findElements(By.xpath(".//tr"));

// Looping through rows and get cell values
for (WebElement rw : r) {
   List<WebElement> cell = rw.findElements(By.xpath(".//th"));
   for (WebElement c : cell) {
      String value = c.getText();
      System.out.println(value);
   }
}

Example

Code Implementation on HandlingWebTables.java class file.

package org.example;

import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;
import java.util.List;
import java.util.concurrent.TimeUnit;

public class HandlingWebTable {
   public static void main(String[] args) throws InterruptedException {

      // Initiate the Webdriver
      WebDriver driver = new ChromeDriver();

      // adding implicit wait of 15 secs
      driver.manage().timeouts().implicitlyWait(15, TimeUnit.SECONDS);
      
      // Open the webpage
      driver.get("https://www.tutorialspoint.com/selenium/practice/webtables.php");

      // Locate the table element
      WebElement table1 = driver..findElement
         (By.xpath ("/html/body/main/div/div/div[2]/form/div[2]/table"));

      // Find all rows in the table
      List<WebElement> r = table1.findElements(By.xpath(".//tr"));

      // Looping through rows and get headers
      for (WebElement rw : r) {
         List<WebElement> cell = rw.findElements(By.xpath(".//th"));
         for (WebElement c : cell) {
            String value = c.getText();
            System.out.println("Table headers: " + value);
         }
      }

      // Closing browser
      driver.quit();
   }
}

Output

Table headers: First Name
Table headers: Last Name
Table headers: Age
Table headers: Email
Table headers: Salary
Table headers: Department
Table headers: Action

Process finished with exit code 0

In the above example, we had captured all the table headers in the table.

Finally, the message Process finished with exit code 0 was received, signifying successful execution of the code.

Thus, in this tutorial, we had discussed how to handle dynamic web tables using the Selenium Webdriver.

Advertisements