Skip to main content

​
GridElement

Playwright element wrapper for <vaadin-grid> providing helpers for scrolling, querying visible rows, accessing cell content, and interacting with the grid’s header, body, and selection.

​
Component Tag

vaadin-grid

​
Implements

  • FocusableElement - Focus management
  • HasStyleElement - CSS class and style management
  • HasThemeElement - Theme variant support
  • HasEnabledElement - Enable/disable state

​
Constructor

​
locator
Locator
required
Playwright locator for the <vaadin-grid> element

​
Static Factory Methods

​
get

Get the first grid on the page or within a parent locator. 
GridElement.get(Page page)
GridElement.get(Locator parent)
​
page
Page
Playwright page
​
parent
Locator
Parent locator to search within

​
getById

Get a grid by its id attribute. 
GridElement.getById(Page page, String id)
​
page
Page
Playwright page
​
id
String
Element id

​
Row and Column Methods

​
getTotalRowCount

Get the total number of rows (data items) in the grid. 
int getTotalRowCount()

​
getRenderedRowCount

Get the number of rows currently rendered in the DOM (may be less than total due to virtualization). 
int getRenderedRowCount()

​
getColumnCount

Get the number of visible (non-hidden) columns. 
int getColumnCount()

​
isAllRowsVisible

Whether the grid has allRowsVisible enabled. 
boolean isAllRowsVisible()

​
Header Methods

​
findHeaderCell

Find a header cell by column index. 
Optional<HeaderCellElement> findHeaderCell(int columnIndex)
Optional<HeaderCellElement> findHeaderCell(int headerRowIndex, int columnIndex)
​
headerRowIndex
int
0-based header row index (default 0)
​
columnIndex
int
0-based visible column index

​
findHeaderCellByText

Find a header cell by its text content. 
Optional<HeaderCellElement> findHeaderCellByText(String text)
Optional<HeaderCellElement> findHeaderCellByText(int headerRowIndex, String text)
​
headerRowIndex
int
0-based header row index (default 0)
​
text
String
Header text to find

​
getHeaderCellContents

Get the text content of all visible header cells. 
List<String> getHeaderCellContents()
Returns a list of header cell text contents.

​
Cell Access Methods

​
findCell

Find a body cell by row and column index, or by row index and column header text. 
Optional<CellElement> findCell(int row, int column)
Optional<CellElement> findCell(int row, String columnHeaderText)
​
row
int
0-based row index
​
column
int
0-based column index
​
columnHeaderText
String
Header text of the column

​
findRow

Find a row by its index (scrolls if necessary). 
Optional<RowElement> findRow(int rowIndex)
​
rowIndex
int
0-based row index
Returns a RowElement wrapper providing cell access and selection methods.

​
findRowIndexesWithColumnText

Find row indexes where the cell in the given column has the given text. 
List<Integer> findRowIndexesWithColumnText(int columnIndex, String text)
​
columnIndex
int
Column index to check
​
text
String
Text to match

​
Scroll Methods

​
scrollToRow

Scroll the grid so the given row index becomes visible. 
void scrollToRow(int rowIndex)
​
rowIndex
int
0-based row index

​
scrollToStart

Scroll to the very beginning of the grid. 
void scrollToStart()

​
scrollToEnd

Scroll to the very end of the grid. 
void scrollToEnd()

​
Selection Methods

​
select

Select a row by index. 
void select(int rowIndex)
​
rowIndex
int
Row index to select

​
deselect

Deselect a row by index. 
void deselect(int rowIndex)
​
rowIndex
int
Row index to deselect

​
getSelectedItemCount

Get the number of currently selected items. 
int getSelectedItemCount()

​
checkSelectAll

Check the select-all checkbox. 
void checkSelectAll()

​
uncheckSelectAll

Uncheck the select-all checkbox. 
void uncheckSelectAll()

​
isSelectAllChecked

Check if the select-all checkbox is checked. 
boolean isSelectAllChecked()

​
isSelectAllIndeterminate

Check if the select-all checkbox is indeterminate. 
boolean isSelectAllIndeterminate()

​
Utility Methods

​
waitForGridToStopLoading

Wait for the grid to finish loading after a scroll or other action. 
void waitForGridToStopLoading()

​
Inner Classes

​
CellElement

Represents a cell in the grid.

​
Methods

  • Locator getTableCellLocator() - Get the table cell (td or th) locator
  • int getColumnIndex() - Get the 0-based column index
  • Locator getCellContentLocator() - Get the cell content locator
  • String getContentSlotName() - Get the slot name for cell content
  • void click() - Click the cell content

​
HeaderCellElement

Extends CellElement for header cells with sorting support.

​
Methods

  • boolean isSortable() - Whether the header supports sorting
  • void clickSort() - Click to sort the column
  • boolean isSortAscending() - Whether sorted ascending
  • boolean isSortDescending() - Whether sorted descending
  • boolean isNotSorted() - Whether not sorted

​
RowElement

Represents a row in the grid.

​
Methods

  • Locator getRowLocator() - Get the row (tr) locator
  • int getRowIndex() - Get the 0-based row index
  • CellElement getCell(int columnIndex) - Get cell by column index
  • CellElement getCell(String columnHeaderText) - Get cell by header text
  • CellElement getDetailsCell() - Get the details cell
  • boolean isSelected() - Whether the row is selected
  • void select() - Select the row
  • void deselect() - Deselect the row
  • void openDetails() - Open row details
  • void closeDetails() - Close row details
  • boolean isDetailsOpen() - Whether details are open

​
Usage Examples

​
Basic Grid Operations

GridElement grid = GridElement.getById(page, "basic-grid");
grid.assertVisible();
assertEquals(100, grid.getTotalRowCount());
assertEquals(3, grid.getColumnCount());

​
Access Headers

GridElement grid = GridElement.get(page);
List<String> headers = grid.getHeaderCellContents();
assertEquals(List.of("First Name", "Last Name", "Email"), headers);

// Find specific header
var headerCell = grid.findHeaderCellByText("First Name");
assertTrue(headerCell.isPresent());
assertEquals(0, headerCell.get().getColumnIndex());

​
Access Cell Content

GridElement grid = GridElement.getById(page, "basic-grid");

// By row and column index
var cell = grid.findCell(0, 0);
assertThat(cell.get().getCellContentLocator()).hasText("First1");

// By row index and column header
var emailCell = grid.findCell(0, "Email");
assertThat(emailCell.get().getCellContentLocator()).hasText("[email protected]");

​
Work with Rows

GridElement grid = GridElement.get(page);

var row = grid.findRow(0);
if (row.isPresent()) {
    RowElement rowEl = row.get();
    
    // Access cells in row
    CellElement firstCell = rowEl.getCell(0);
    CellElement emailCell = rowEl.getCell("Email");
    
    // Selection
    rowEl.select();
    assertTrue(rowEl.isSelected());
}

​
Sorting

GridElement grid = GridElement.get(page);

var headerCell = grid.findHeaderCellByText("First Name").get();
if (headerCell.isSortable()) {
    headerCell.clickSort();
    assertTrue(headerCell.isSortAscending());
    
    headerCell.clickSort();
    assertTrue(headerCell.isSortDescending());
}

​
Scroll to Distant Row

GridElement grid = GridElement.getById(page, "lazy-grid");
var row = grid.findRow(9000);
assertTrue(row.isPresent());
assertThat(row.get().getCell(0).getCellContentLocator()).hasText("First9001");

​
Selection Operations

GridElement grid = GridElement.get(page);

// Select single row
grid.select(0);
assertEquals(1, grid.getSelectedItemCount());

// Select all
grid.checkSelectAll();
true(grid.isSelectAllChecked());

// Deselect
grid.uncheckSelectAll();
assertEquals(0, grid.getSelectedItemCount());

Build docs developers (and LLMs) love

Get started for freeTalk to us