4 things to do while Testing Data table in Selenium

DataTables is a jQuery plugin that can be used for adding interactive and advanced controls to HTML tables for the webpage. This also allows the data in the table to be searched, sorted, and filtered according to the needs of the user. The DataTables also exposes a powerful API that can be further used to modify how the data is displayed.

The order option is used to specify the rows of the DataTable that have to be ordered and their direction. It accepts a two-dimensional array that allows the ordering to be specified in multiple columns at once. The column defined first would be given more priority in sorting.

In this blog we will read the data using Selenium and test the data table’s sort functionality along with Dynamic Column Selection, Pagination.

Sorting the Column in desired order

First we issue a click on the header of the column being tested. But we do not know the sort order of the column. It may be ordered in ascending or descending.To make sure the column is in the required order, we need to check the order against the input order. This way we can make sure the column is in the required order irrespective of what it was!

public void sortByColumn(String colName, String order) {
	WebElement th = driver.findElement(XPath here);
		th.click();
		String sortOrder = th.getAttribute("aria-sort");
		if (!order.equalsIgnoreCase(sortOrder)) {
			th.click();
		}
	}// for clicking

Dynamic Column Selection

Then we proceed to extract data from all the rows of the column. To do this we need to find the position of the column in the table. One way to find the column is to hard code the index based on the column’s position in the data table.

Instead of hard coding the column index, we need to dynamically find it based on the name of the column. This way we make sure the test code does not need to change in the future if the column’s position is changed in the data table.

To do this we need to get the index of the column in the data table by using name of the data column as follows.

// Find the index of passed column
        List<WebElement> tableHeaders = driver.findElements(<XPath here>);
        int columnIndex = 0;
        for (int i = 0; i < tableHeaders.size(); i++) {
            if (tableHeaders.get(i).getText().equals(colName)) {
                columnIndex = i + 1;
                break;
            }
        }

Pagination

When it comes to datatable with lot of pages, obviously we have to check each page of the table must be sorted accurately. So let’s see how we can do that.

After getting the column index, we loop each page of the data table and collect the data from the required column into a list.

Note that we have used do-while loop for pagination because we need to loop at least once before checking if there are more pages. Inside the loop we check the presence of next page for every iteration.

List<String> result = new ArrayList<>();
        boolean goNext = false;
        do { // check each page of the table
            List<WebElement> tableRows = driver.findElements(<data table XPath here>);
            for (int i = 0; i < tableRows.size(); i++) {
                WebElement row = tableRows.get(i);
                String data = row.findElement(By.xpath("//td[" + columnIndex + "]")).getText();
            result.add(data.strip().toLowerCase());
            }
            // Navigate to the next page if its available
            boolean paginationNext = driver.findElement(<XPath here>).isEnabled();
            goNext = paginationNext;
            if (paginationNext) {
                driver.findElement(<XPath here>).click();
            }
          } while (goNext);
            return result;
            }

Verifying the column sort order

Now we come to the final one sorting. We will see how to verify data table sorting in selenium with and without using third party library.

The most common way of verifying the sort order is by reading the data, sorting it in the test class and then comparing it against the data shown in the data table. First we get the data (displayed in the browser) from the page object, copy it to another list and sort it (ascending or descending) using java. After sorting it, we compare it against the original list to see if they match.

List tempList=new ArrayList();
         tempList.addAll(result);
         
         tempList.sort(); // if we need to sort in natural(ascending order)
            //or
         tempList.sort(Collections.reverseOrder()); // if we need to sort in descending order
         assertEquals(tempList, result); // Verify the lists are equal.

Using Google Guava Library

What is Google Guava Library?

Guava is a set of core Java libraries from Google that includes new collection types (such as multi map and multi set), immutable collections, a graph library, and utilities for concurrency, I/O, hashing, caching, primitives, strings, and more! It is widely used on most Java projects within Google, and widely used by many other companies as well. It facilitates best coding practices and helps reduce coding errors.

Hence we can use this google guava library to check whether the data is sorted or not instead of our test class. To do that, first we need to add google guava dependency in the POM file of our Maven project.

<dependency>
<groupId>com.google.guava</groupId>
<artifactId>guava</artifactId>
<version>31.1-jre</version>
</dependency>

Next, We have to get data(result) from the page object model and pass it to the guava library to check if it is sorted or not.

assertTrue(Ordering.isOrdered(result)); //Checks for natural(ascending) order

assertTrue(Ordering.reverse().isOrdered(result)); //Checks for descending order

When using third party libraries we can avoid re-inventing the wheel and reduce the code we write. Less code brings advantages like less bugs and easy maintenance.

Thanks for reading my blog . Happy learning!