"Mastering Web Tables with Selenium: Your Ultimate Guide"

What are Web Tables?

Web Tables are like normal tables where the data is presented in a structured form using rows and columns. They are represented by the <table> HTML tag and are commonly used to display information in a grid format. Each cell within the table can contain various types of data, such as text, images, or links.

Example of an HTML Table

Structure of an HTML Table

An HTML table is structured using several specific tags:

• <table>: This is the main tag that defines the table.

• <thead>: Defines the header section of the table.

• <tbody>: Contains the body of the table, where most of the data resides.

• <tfoot>: Defines the footer of the table, often used for summary or total values.

• <tr>: Defines a table row.

• <th>: Defines a header cell (within <thead>, <tbody>, or <tfoot>).

• <td>: Defines a standard data cell.

Types of Web Tables ?

Depending on the data in the table, web tables can be classified as Static web tables and Dynamic web tables.

1.     Static Web Table

Static web tables are HTML tables with a fixed structure and content that does not change dynamically. The data in static web tables remains the same until the page is reloaded or manually updated. These tables are straightforward to interact with because their content is predictable and does not involve dynamic loading or user-driven changes.

2.     Dynamic Web Table

A dynamic web table is an HTML table where the content can change dynamically without reloading the page.

This is often achieved through asynchronous data fetching or user interactions. Dynamic web tables are commonly used to display frequently updated data, such as live financial data, social media feeds, or real-time monitoring systems.

A simplified way to handle Web Tables?

1.Locate the table element.

2.Locate the rows and columns of the table.

3.Perform the necessary actions on the table.

Like clicking the element, retrieving the text of cell, clicking on edit or delete buttons or click on check boxes etc.

Let us consider an example of dynamic web table from a learning website shown in the below image and go through some scenarios.

Scenario 1: Fetch the total records (dynamic data).

Locate the table element and the row element.

Below code snippet fetches the total rows.

Iterate through all pages to get the total count of rows.

Scenario 2: Display the row data and validate the presence of check box for each row.

Below code snippet iterates through all the rows and looks for the check box for each row and prints each row data.

Locate the check box web element.

Scenario 3: validate the edit button for each row

Locate the Edit button web element and iterate through the rows.

How to handle Pagination ?

Pagination is a common feature in web applications, allowing users to navigate through large sets of data in manageable chunks.

In web automation with Selenium, handling pagination involves navigating through each page systematically to scrape or interact with the data efficiently. Follow the below steps to make your work easier .

1.Setup Selenium WebDriver:

Start by setting up your Selenium WebDriver and navigating to the web page with pagination.

2.Identify Pagination Controls:

Locate the pagination controls (Next, Previous, Page Numbers).

3.Navigate and Verify:

Write logic to click through the pages and verify the content.

 Now let's go through the Java code step-by-step.

• The 'validatePagination_totalRecords' Method

This method calculates the total number of records displayed across all paginated pages. It navigates through each page, counts the records, and accumulates the total until there are no more pages to navigate.

I am handling a dynamic WebTable here so my data keeps changing.(This is a very important point to remember as all our web elements locators keep changing.)

1. Initialize Variables:

• totalRowCount keeps track of the cumulative number of rows across all pages.

• hasNextPage is a flag to control the pagination loop.
  

2. While Loop for Pagination:

• I am using a While loop which iterates through all pages by clicking NEXT button and keeps updating my row count variable to get the final count. I will be navigating through all the pages until my next button is disabled.( which means hasNextpage becomes false when Next is disabled).

3. Wait for Row Data Elements:

• This ensures that all row data elements on the current page are visible before proceeding.

4.Count Rows on the Current Page:

• I will be calculating the total number of rows on the current page and add it to the total count once my table rows are populated.

5.Locate and Check 'Next' Button:

• Locate the 'Next' button using XPath.

• Checks if the 'Next' button is enabled. If not, sets hasNextPage to false to exit the loop.

• If the 'Next' button is enabled, waits until it's clickable and clicks it to navigate to the next page.

6.Error Handling:

Catches any exceptions that occur during pagination, logs the error, and exits the loop.

7.Log and Return Total Row Count:

Logs the total number of rows found and returns the count.

Conclusion

This method provides an efficient way to validate pagination by ensuring that all records across multiple pages are counted correctly. By leveraging Selenium WebDriver's waiting mechanisms and exception handling, the method ensures robust and reliable automation for pagination testing.

"I appreciate your time and interest in my content. Thank you for being a part of this community!"