Get Table Cell Using Row and Column Indices

Chain queries

table td {
  border: 1px solid gray;
  padding: 5px;
}

<table>
  <thead>
    <tr>
      <td>ID</td>
      <td>Title</td>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>crispy</td>
      <td>aaa</td>
    </tr>
    <tr>
      <td>medium</td>
      <td>b</td>
    </tr>
  </tbody>
</table>

Let's get the cell in the row 2 and column 2 (index starts with 1)

cy.get('table tbody')
  .find('tr')
  // index starts with 0
  .eq(1)
  .find('td')
  .eq(1)
  .should('have.text', 'b')

Let's confirm the very first cell.

cy.get('table tbody')
  .find('tr')
  // index starts with 0
  .eq(0)
  .find('td')
  .eq(0)
  .should('have.text', 'crispy')

Custom query

Let's create a custom query command to access the table's cell using the row and column indices.

table td {
  border: 1px solid gray;
  padding: 5px;
}

<table>
  <thead>
    <tr>
      <td>ID</td>
      <td>Title</td>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>crispy</td>
      <td>aaa</td>
    </tr>
    <tr>
      <td>medium</td>
      <td>b</td>
    </tr>
  </tbody>
</table>

Cypress.Commands.addQuery('cell', (row, column) => {
  return ($table) => {
    // use jQuery methods to find the row
    // and then access the cell
    // jQuery .find and .eq methods are very close to the Cypress commands
    return $table.find('tbody tr').eq(row).find('td').eq(column)
  }
})
cy.get('table').cell(1, 0).should('have.text', 'medium')