How do I can get a text of all the cells of the table using testcafe

Question

I using the testcafe testing framework - https://devexpress.github.io/testcafe .
I wrote the following code:

const table = Selector('#table');

for(let i = 0; i < table.rows.length; i++){
   for(let j = 0; j < table.columns.length; j++) {
         let tdText = await table.rows[i].cells[j].textContent;
        //another actions
   }
}

How do I can get a text of all the cells of the table using testcafe?

Answer 1

Selector provides methods and properties to select elements on the page and get theirs state, but has no 'rows' and 'columns' properties.

So, use the following solution:

const table       = Selector('#table');
const rowCount    = await table.find('tr').count;
const columnCount = await table.find('tr').nth(0).find('td').count;

for(let i = 0; i < rowCount; i++) {
    for(let j = 0; j < columnCount; j++) {  
        let tdText = await table.find('tr').nth(i).find('td').nth(j).textContent;
        //another actions
    }
}

Note that Selector provides 'find' and 'nth' functions since v0.11.0 (it will be released soon, but it's available yet with npm "alpha" tag).

Answer 2

Do you need all text content? In this case you can just use ClientFunction

import { ClientFunction } from 'testcafe';

const getInnerText = ClientFunction(() => document.getElementById('table').innerText);

const text = await getInnerText();