How to select value from the next row via pup?

Question

Given the following table:

<table>
  <tr>
    <td>Foo</td>
    <td>Bar</td>
    <td>Buzz</td>
  </tr>
  <tr>
    <td>1</td>
    <td>2</td>
    <td>3</td>
  </tr>
  <tr>
    <td>4</td>
    <td>5</td>
    <td>6</td>
  </tr>
</table>

Assuming I don't know the fixed position of the value, I'd like to select the 2nd row by giving the 1st row column name, for example:

• Foo => 1
• Bar => 2
• Buzz => 3

---

Currently I know how to get the name of the column (1st row):

$ pup -f table.html 'td:contains("Foo") text{}'
Foo

I know how to return the next column by:

$ pup -f table.html 'td:contains("Foo") + td text{}'
Bar

I would expect to get the next row by:

$ pup -f table.html 'td:contains("Foo") + tr text{}'

but it doesn't return anything (I expect to be 1).

Here is the solution with jQuery, but I expect the solution to work with pup command.

I've checked Mozilla's CSS selector docs page, but I couldn't find anything suitable.

Answer 1

Your selector

td:contains("Foo") + tr text{}

represents the text of a tr that directly follows a td, as a sibling. Based on the table structure, trs aren't siblings of tds — they are their parents.

pup features its own :parent-of() pseudo-class, listed here, but that won't be enough for your needs since there's no way for you to select the next row's td in the same column as the one you have. Selectors 4's column combinator || does exactly what you want, but it's not implemented anywhere, and certainly not in pup. It won't be trivial to do this with any command-line tool that primarily works with CSS selectors.