Taiko: proposal: add an api to locate/read from table

Created on 22 Mar 2019 · 5Comments · Source: getgauge/taiko

Expected behavior

there should be an easy way to locate and read values from a table. I propose that we have an api table that should lookup an html table with parameters provided.

Further there could be way to reach a cell, some examples:

col(3, row(2, in(table(below("sometext")))))
row(2, col(3, in(table(below("sometext"))))) //same as above
col(3, row(below("foo", in(table(below("sometext")))))

Actual behavior

The only way to parse a table is to use proximity selectors, which can be cumbersome for large number of traversals.

Versions

$ node --version
v10.15.3

$ taiko
Version: 0.7.0 (Chromium:74.0.3723.0)

Source

sriv

👍3

All 5 comments

Would it be alright to follow some other style, something like

table(below('sometext')).cell(row,col)
table(below('sometext')).cell(1,5)

o-x-y-g-e-n on 20 Dec 2019

Assuming this api will be for asserting text, or performing an action is it fair to make this flat and compatible with the other api for e.g.

text("something", tableCell({row: 1, column: 3}, below("some text"))).exists()
click(tableCell({row: 1, column: 3}, below("some text")))

zabil on 20 Dec 2019

👍1

added via #466. ref: https://taiko-preview.gauge.org/#tablecell

thanks @o-x-y-g-e-n

sriv on 10 Jan 2020

👍1

Kindly find the below observations:

Steps to reproduce:

openBrowser();
goto("https://www.toolsqa.com/automation-practice-table/")

tableCell({row:0, col:0}, "Sample Table").text()
getting the below error:

TypeError: s.match is not a function

getting the wrong value from a required cell:
> tableCell({row:1, col:1}, "Sample Table").text()
o/p : > tableCell({row:1, col:1}, "Sample Table").text() value: '4 buildings'
tableCell({row:1, col:1}, "HTML Table").exists()
output: value: false ✔ Does not exists

for the above observation 3. kindly find the below html snippet:

<!DOCTYPE html>
<html>

   <head>
      <title>TIME TABLE</title>
   </head>

   <body>
      <table border = "1" cellspacing="1" bordercolor="blue" bgcolor="yellow">
         <tr>
            <th colspan="8">TIME TABLE</th>
         </tr>

         <tr>
            <th>DAYS</th>
            <th>1</th>
            <th>2</th>
            <th>3</th>
            <th rowspan="7">lunch break</th>
            <th>4</th>
            <th>5</th>
            <th>6</th>
         </tr>
         <tr>
             <td>MONDAY</td>
             <td>Accounts</td>
             <td>English</td>
             <td>Statistics</td>
             <td>Banking</td>
             <td align="center">-</td>
             <td align="center">EP</td>
         </tr>
         <tr>
             <td>TUESDAY</td>
             <td>Statistics</td>
             <td>Banking</td>
             <td>English</td>
             <td>Accounts</td>
             <td align="center">-</td>
             <td align="center">-</td>
         </tr>
         <tr>
             <td>WEDNESDAY</td>
             <td>English</td>
             <td>Statistics</td>
             <td>Accounts</td>
             <td align="center">EP</td>
             <td>Banking</td>
             <td align="center">-</td>
         </tr>
         <tr>
             <td>THURSDAY</td>
             <td align="center">-</td>
             <td align="center">CA</td>
             <td>Statistics</td>
             <td>English</td>
             <td align="center">EP</td>
             <td align="center">-</td>
         </tr>
         <tr>
             <td>FRIDAY</td>
             <td>Banking</td>
             <td>Statistics</td>
             <td>English</td>
             <td colspan="2" align="center">ICT</td>
             <td align="center">CA</td>
         </tr>
         <tr>
             <td>SATURSDAY</td>
             <td>Banking</td>
             <td align="center">CA</td>
             <td>Statistics</td>
             <td colspan="2" align="center">English</td>
             <td>Accounts</td>
         </tr>

      </table>

   </body>
</html>

Tested version:
Version: 1.0.3 (Chromium: 81.0.3994.0) 8bf5be40abd96c2f391d94665e3005929d838de8

Debashis9012 on 27 Jan 2020

@sriv pinged me on a separate chat about this issue. The problem in the provided website is that the HTML is technically malformed (tfoot appears before tbody). However, as the browser is still able to parse and present it correctly, the selector needs to know how to exclude td elements that are descendants of tfoot.

I suggest using the not and ancestor features in XPath to exclude descendants of tfoot. The same principle can be applied to exclude elements with display: table-cell which are descendants of display: table-footer-group if it is desired to have the selector support "table-like" components that are not semantic HTML tables.

Here is a codesandbox demonstrating this idea.