MSE-ReadyToUseSeleniumCode – Storing Web Table Data Into List Of Map – Java

I started a series of “Ready To Use Selenium Java Code”. In the first post in this series, we will learn “Storing a Web table data in to a List of Map using Selenium-Java.”.

WHAT IS WEB TABLE?

A table is made of rows and columns. When we create a table for a web page, that is called as a web table. In HTML, a web table is created using 

 tag. Web table is a HTML structure for creating rows and columns on a Web page.

A web table can consists below parts:

1. Header(s): It is created using

tag.

Columns(s):It is created using

and remaining row can be grouped as . Last row can also be grouped as . An example is shown below:-

tag. Row(s):It is created using
tag. A typical web table’s first row is marked as header and from second row onward, it stores values. Table headers can be grouped using

Item	Price
Rice	100
Veg	200
Sum	300

If you save above html code as .html and open a web browser, you will see output as below:-

So, we are going to learn how can we store a web table data in a Java Collection. Let’s start with logic and connect dots.

Let’s have a bigger web table first. HTML Code is as below:-

ID	Name	Age	Expereince	Location	Marital Status	Native	Email ID	Mobile No	Ready To Relocate
1	Amod	29	7 Years	Bengaluru	No	Bihar	amod@gmail.com	12345	Yes
2	Mukesh	30	8 Years	Bengaluru	Yes	MP	mukesh@gmail.com	23456	Yes
3	Animesh	29	5 Years	Kolkata	No	Gujrat	animesh@gmail.com	98765	No
4	Aaditya	27	3 Years	Bhopal	No	Bihar	aaditya@gmail.com	34567	No
5	Prince	36	10 Years	Dehradun	No	WB	navneet@gmail.com	68768	Yes
6	Anu	26	3 Years	Pune	No	CG	anu@gmail.com	78676	Yes
7	Sneha	27	5 Years	Delhi	Yes	KA	sneha@gmail.com	32432	No

Save above html code in a file with .html extension and open in a web browser. You will see a table as below:-

Let’s break logic to multiple points first:-

1.First row is header and remaining are data.

2. We can store all data in a Java Collection List but identification of data is difficult i.e. which data represents which value.

3. It is good to store each row in a map where key will be header name and value will be current row cell value. For E.g. [Name=Amod, Age=29…..]

4. After adding a row in to Map, add that Map in to List. So we will have a List of Map.

[{ID=1, Name=Amod, Age=29, Expereince=7 Years, Location=Bengaluru, Marital Status=No, Native=Bihar, Email ID=amod@gmail.com, Mobile No=12345, Ready To Relocate=Yes},

{ID=2, Name=Mukesh, Age=30, Expereince=8 Years, Location=Bengaluru, Marital Status=Yes, Native=MP, Email ID=mukesh@gmail.com, Mobile No=23456, Ready To Relocate=Yes}, …]

5. You can customize in whatever you want. You may want to store in a Map where ID or Name will be key and remaining as value for easy picking.

[{Amod = {ID=1, Name=Amod, Age=29, Expereince=7 Years, Location=Bengaluru, Marital Status=No, Native=Bihar, Email ID=amod@gmail.com, Mobile No=12345, Ready To Relocate=Yes},

{Mukesh = {ID=2, Name=Mukesh, Age=30, Expereince=8 Years, Location=Bengaluru, Marital Status=Yes, Native=MP, Email ID=mukesh@gmail.com, Mobile No=23456, Ready To Relocate=Yes}, …]

Below is Java Code. I have tried explaining code well. If you face any issue in understanding please send me a mail or comment. There may be more optimal way of doing the same. I welcome all refactored code as comment on post.

package WebTablesExamples;

import java.util.ArrayList;
import java.util.LinkedHashMap;
import java.util.List;
import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;
import org.testng.annotations.Test;

import io.github.bonigarcia.wdm.WebDriverManager;

public class ReadTableDataInListOfMap {

        @Test
        public void readTableDataInListOfMap() {
                // Browser initialization
                WebDriverManager.chromedriver().setup();
                WebDriver driver = new ChromeDriver();
                String fileURL = System.getProperty("user.dir");
                driver.get(fileURL + "/src/test/resources/htmlFiles/WebTable.html");

                // Let's get header first
                String headerLoc = "//table[@class='tg']//tr//th";
                List allHeadersEle = driver.findElements(By.xpath(headerLoc));
                List allHeaderNames = new ArrayList();
                for (WebElement header : allHeadersEle) {
                        String headerName = header.getText();
                        allHeaderNames.add(headerName);
                }

                // Each row will be a key value pair. So we will use LinkedHashMap so that order
                // can be retained.
                // All map will be added to a list.
                List> allTableData = new ArrayList>();

                // Get total rows count
                String rowLoc = "//table[@class='tg']//tr";
                List allRowsEle = driver.findElements(By.xpath(rowLoc));
                // Starting from 2 as first row is header. Remember xpath index starts from 1
                for (int i = 2; i <= allRowsEle.size(); i++) {
                        // Getting specific row with each iteration
                        String specificRowLoc = "//table[@class='tg']//tr[" + i + "]";
                        // Locating only cells of specific row.
                        List allColumnsEle = driver.findElement(By.xpath(specificRowLoc))
                                        .findElements(By.tagName("td"));
                        // Creating a map to store key-value pair data. It will be created for each
                        // iteration of row
                        LinkedHashMap eachRowData = new LinkedHashMap<>();
                        // Iterating each cell
                        for (int j = 0; j < allColumnsEle.size(); j++) {
                                // Getting cell value
                                String cellValue = allColumnsEle.get(j).getText();
                                // We will put in to map with header name and value with iteration
                                // Get jth index value from allHeaderNames and jth cell value of row
                                eachRowData.put(allHeaderNames.get(j), cellValue);
                        }
                        // After iterating row completely, add in to list.
                        allTableData.add(eachRowData);

                }

                System.out.println(allTableData);
                driver.quit();

        }

}

Output:-

[{ID=1, Name=Amod, Age=29, Expereince=7 Years, Location=Bengaluru, Marital Status=No, Native=Bihar, Email ID=amod@gmail.com, Mobile No=12345, Ready To Relocate=Yes}, 
 {ID=2, Name=Mukesh, Age=30, Expereince=8 Years, Location=Bengaluru, Marital Status=Yes, Native=MP, Email ID=mukesh@gmail.com, Mobile No=23456, Ready To Relocate=Yes}, 
 {ID=3, Name=Animesh, Age=29, Expereince=5 Years, Location=Kolkata, Marital Status=No, Native=Gujrat, Email ID=animesh@gmail.com, Mobile No=98765, Ready To Relocate=No}, 
 {ID=4, Name=Aaditya, Age=27, Expereince=3 Years, Location=Bhopal, Marital Status=No, Native=Bihar, Email ID=aaditya@gmail.com, Mobile No=34567, Ready To Relocate=No}, 
 {ID=5, Name=Prince, Age=36, Expereince=10 Years, Location=Dehradun, Marital Status=No, Native=WB, Email ID=navneet@gmail.com, Mobile No=68768, Ready To Relocate=Yes}, 
 {ID=6, Name=Anu, Age=26, Expereince=3 Years, Location=Pune, Marital Status=No, Native=CG, Email ID=anu@gmail.com, Mobile No=78676, Ready To Relocate=Yes}, 
 {ID=7, Name=Sneha, Age=27, Expereince=5 Years, Location=Delhi, Marital Status=Yes, Native=KA, Email ID=sneha@gmail.com, Mobile No=32432, Ready To Relocate=No}]

You may need to edit code based on your web table but logic will be less or more same.

You can clone code from my git repo.

If you have any doubt, feel free to comment below.
If you like my posts, please like, comment, share and subscribe.
#ThanksForReading
#HappyLearning

You can find all Selenium related post here.
You can find all API manual and automation related posts here.
You can find frequently asked Java Programs here.