Description
const table = await this.screen.queryByTestId(id)
const rowsByGroup = await this.within(table).getAllByRole('rowgroup');
const tableRows= await this.within(rowsByGroup.nth(1)).getAllByRole('row');
let noOfRows = await tableRows.count();
for (let i = 0; i < noOfRows - 1; i++) {
let year = await within(tableRows.nth(i)).queryByTestId(/year/).textContent();
let status = await within(tableRows.nth(i)).queryByTestId(/status/).textContent();
if (year === '2027') {
await within(tableRows.nth(i)).queryAllByRole('cell').within().queryByRole('button', {name: 'kebab-menu'}).click();
await within(tableRows.nth(i)).queryAllByRole('cell').within().queryByRole('menuitem', {name: 'Delete Auction'}).click();
break;
}
}
**here in the code snippet, we query by all rows using rowgroup and store the count and then iterating using for loop and find the td element in each row, using the index await within(tableRows.nth(i)).queryByTestId(/year/).textContent(); like this.
Instead of using the index and looping thru, I would like to use forEach and map to iterate, to avoid using traditional for loop with indexing ie i etc. is there any other way to loop thru the tables , other than traditional for loop with indexing? Can you please advise:**
Error:
when i used map or forEach tableRows.forEach(), TypeError: tableRows.forEach is not a function
This is the output -tableRows
Locator@query-by-test-id=["paged-table-IFVacationAuctionSummaries"] >> get-all-by-role=["rowgroup"] >> nth=1 >> get-all-by-role=["row"]. ------> Can i not iterate thru tableRows using forEach or map , Can you please advise?
Below is the table html
<table data-testid="paged-table-IFVacationAuctionSummaries" class="css-1n5gbw2" css="1">
<thead class="css-2006i1">
<tr data-testid="paged-table-header-IFVacationAuctionSummaries" class="css-62m37e"></tr>
</thead>
<tbody class="css-vvv4s9">
<tr data-testid="**row-IFVacationAuctionSummaries-0**" class="css-1fwx1hv">
<td data-testid="**td-IFVacationAuctionSummaries-year-0**" class="css-610bfy">
<a href="/resource?href=https%3A%2F%2F.order.corp.com%2Fbacw%2Fvacation%2Fauctions%2F0d1d2408-575c-40c1-a23c-b227a970bb0c">
**2027**
</a>
</td>
<td data-testid="**td-IFVacationAuctionSummaries-lastModifiedUserName-0**" class="css-610bfy">
Mary
</td>
<td data-testid="**td-IFVacationAuctionSummaries-lastModifiedAt-0**" class="css-610bfy"></td>
<td data-testid="**td-IFVacationAuctionSummaries-status-0"** class="css-610bfy">
DRAFT
</td>
<td data-testid="td-IFVacationAuctionSummaries-createdByUserName-0" class="css-610bfy">
Ann Oh
</td>
<td data-testid="**td-IFVacationAuctionSummaries-createdAt-0**" class="css-610bfy">
03/15/2023
</td>
<td data-testid="**td-IFVacationAuctionSummaries-crewMemberCount-0**" class="css-610bfy">
8,075
</td>
<td>
<div data-testid="actions-0" id="actions-0" class="css-3p4l1v">
<span aria-haspopup="true" aria-controls="actions-0" aria-expanded="false" tabindex="0" id="menu-anchor-actions-0" class="css-9tt7yw">
<div class="css-19dstse">
<button data-testid="button-anchor" type="button" id="button-anchor" aria-labelledby="button-anchor" class="css-16nx0iz">
<span class="css-1oteowz">
<div data-testid="button-text-button-anchor" class="css-rxxi15">
<div class="css-rqx7yd"></div>
</div>
</span>
</button>
</div>
</span>
</div>
</td>
<th data-testid="cl-datatable-row--draft" class="css-1oqj8r9"></th>
</tr>
<tr data-testid="row-IFVacationAuctionSummaries-1" class="css-1fwx1hv">
<td data-testid="td-IFVacationAuctionSummaries-year-1" class="css-610bfy"></td>
<td data-testid="td-IFVacationAuctionSummaries-lastModifiedUserName-1" class="css-610bfy"></td>
<td data-testid="td-IFVacationAuctionSummaries-lastModifiedAt-1" class="css-610bfy"></td>
<td data-testid="td-IFVacationAuctionSummaries-status-1" class="css-610bfy"></td>
<td data-testid="td-IFVacationAuctionSummaries-createdByUserName-1" class="css-610bfy"></td>
<td data-testid="td-IFVacationAuctionSummaries-createdAt-1" class="css-610bfy"></td>
<td data-testid="td-IFVacationAuctionSummaries-crewMemberCount-1" class="css-610bfy"></td>
<td></td>
<th data-testid="cl-datatable-row--draft" class="css-1oqj8r9"></th>
</tr>
<tr data-testid="row-IFVacationAuctionSummaries-2" class="css-1fwx1hv">
<td data-testid="td-IFVacationAuctionSummaries-year-2" class="css-610bfy"></td>
<td data-testid="td-IFVacationAuctionSummaries-lastModifiedUserName-2" class="css-610bfy"></td>
<td data-testid="td-IFVacationAuctionSummaries-lastModifiedAt-2" class="css-610bfy"></td>
<td data-testid="td-IFVacationAuctionSummaries-status-2" class="css-610bfy"></td>
<td data-testid="td-IFVacationAuctionSummaries-createdByUserName-2" class="css-610bfy"></td>
<td data-testid="td-IFVacationAuctionSummaries-createdAt-2" class="css-610bfy"></td>
<td data-testid="td-IFVacationAuctionSummaries-crewMemberCount-2" class="css-610bfy"></td>
<td></td>
<th data-testid="cl-datatable-row--draft" class="css-1oqj8r9"></th>
</tr>
<tr data-testid="row-IFVacationAuctionSummaries-3" class="css-1fwx1hv">
<td data-testid="td-IFVacationAuctionSummaries-year-3" class="css-610bfy"></td>
<td data-testid="td-IFVacationAuctionSummaries-lastModifiedUserName-3" class="css-610bfy"></td>
<td data-testid="td-IFVacationAuctionSummaries-lastModifiedAt-3" class="css-610bfy"></td>
<td data-testid="td-IFVacationAuctionSummaries-status-3" class="css-610bfy"></td>
<td data-testid="td-IFVacationAuctionSummaries-createdByUserName-3" class="css-610bfy"></td>
<td data-testid="td-IFVacationAuctionSummaries-createdAt-3" class="css-610bfy"></td>
<td data-testid="td-IFVacationAuctionSummaries-crewMemberCount-3" class="css-610bfy"></td>
<th data-testid="cl-datatable-row--success" class="css-pf7zk1"></th>
</tr>
<tr id="loader"></tr>
</tbody>
</table>