Selenium WebDriver provides the WebElement
interface to work with various types of HTML elements. It also provides helper classes to work with the Select
element. However, there is no built-in class to support the web tables or the <table>
elements. In this recipe, we will implement a helper class for web tables. Using this class, we will retrieve properties and perform some basic operations on a web table element.
Create a new Java class WebTable.java
, which we will use to implement support for the table elements.
Let's implement the web table extension code with WebTable.java
using the following steps:
WebTable
class, and for the setter and getter property methods as well. The WebTable
constructor will accept the WebElement
object, as shown in the following code:package com.secookbook.examples.chapter09; import org.openqa.selenium.NoSuchElementException; import org.openqa.selenium.WebElement; import org.openqa.selenium.By; import java.util.List; public class WebTable { private WebElement _webTable; public WebTable(WebElement webTable) { set_webTable(webTable); } public WebElement get_webTable() { return _webTable; } public void set_webTable(WebElement _webTable) { this._webTable = _webTable; } }
public int getRowCount() { List<WebElement> tableRows = _webTable.findElements(By.tagName("tr")); return tableRows.size(); } public int getColumnCount() { List<WebElement> tableRows = _webTable.findElements(By.tagName("tr")); WebElement headerRow = tableRows.get(0); List<WebElement> tableCols = headerRow.findElements(By.tagName("td")); return tableCols.size(); }
getCellData()
to retrieve data from a specific cell of the table:public String getCellData(int rowIdx, int colIdx) { List<WebElement> tableRows = _webTable.findElements(By.tagName("tr")); WebElement currentRow = tableRows.get(rowIdx-1); List<WebElement> tableCols = currentRow.findElements(By.tagName("td")); WebElement cell = tableCols.get(colIdx-1); return cell.getText(); }
public WebElement getCellEditor(int rowIdx, int colIdx, int editorIdx) throws NoSuchElementException { try { List<WebElement> tableRows = _webTable.findElements(By.tagName("tr")); WebElement currentRow = tableRows.get(rowIdx-1); List<WebElement> tableCols = currentRow.findElements(By.tagName("td")); WebElement cell = tableCols.get(colIdx-1); WebElement cellEditor = cell.findElements(By.tagName("input")).get(editorIdx); return cellEditor; } catch (NoSuchElementException e) { throw new NoSuchElementException("Failed to get cell editor"); } }
WebTable
class:package com.secookbook.examples.chapter09; import org.openqa.selenium.WebDriver; import org.openqa.selenium.firefox.FirefoxDriver; import org.openqa.selenium.WebElement; import org.openqa.selenium.By; import static org.junit.Assert.*; import org.junit.After; import org.junit.Before; import org.junit.Test; public class WebTableTests { WebDriver driver; @Before public void setUp() { // Create a new instance of the Firefox driver driver = new FirefoxDriver(); driver.get("http:// cookbook.seleniumacademy.com/Locators.html"); } @Test public void testWebTableTest() { // Get the table element as WebTable instance using CSS Selector WebTable table = new WebTable(driver.findElement(By.cssSelector("div.cart-info table"))); // Verify that it has three rows assertEquals(3, table.getRowCount()); // Verify that it has six columns assertEquals(5, table.getColumnCount()); // Verify that specified value exists in second cell of third row assertEquals("iPhone", table.getCellData(3, 1)); // Get in cell editor and enter some value WebElement cellEdit = table.getCellEditor(3, 3, 0); cellEdit.clear(); cellEdit.sendKeys("2"); } @After public void tearDown() { // Close the browser driver.quit(); } }
The WebTable
class accepts a WebElement
object and extends it to provide table-specific properties and operations.
To retrieve the number of rows from a table, we locate the <tr>
elements from the _webTable
object. We used the tagName()
method of the By
class and collected all the <tr>
elements as a list of WebElement
objects. Using the size()
method, we can find out how may rows are available in the table element, as shown in the following code:
List<WebElement> tableRows = _webTable.findElements(By.tagName("tr"));
Similarly, we inspected a number of <td>
elements in the first row of the table (normally the header) to retrieve the number of columns available in the table element, as shown in the following code:
List<WebElement> tableRows = _webTable.findElements(By.tagName("tr")); WebElement headerRow = tableRows.get(0); List<WebElement> tableCols = headerRow.findElements(By.tagName("td"));
To retrieve data from a specific cell, the getCellData()
function accepts row and column number arguments. First, it gets the <tr>
element from the list by using the row argument as an index, as shown in the following code:
List<WebElement> tableRows = _webTable.findElements(By.tagName("tr")); WebElement currentRow = tableRows.get(rowIdx-1);
Then, it retrieves the <td>
elements from currentRow
using column argument as an index, as shown in following code:
List<WebElement> tableCols = currentRow.findElements(By.tagName("td")); WebElement cell = tableCols.get(colIdx-1);
To retrieve the text, it calls the cell
object's getText()
method, as shown in following code:
return cell.getText();
Often we need to test tables with editable cells. These could be dynamic tables based on database values. The getCellEditor()
method of the WebTable
object provides access to the first input element of the cell. We can then use this input element and perform actions such as Click()
or SendKeys()
. The getCellEditor()
method uses a similar method to reach the desired cell and then finds the first input element inside a cell, that is, a <td>
element, using the ByTagName
locator strategy, as shown in the following code:
WebElement cellEditor = cell.findElements(By.tagName("input")).get(0);
52.14.39.59