使用 CSS 和 Capybara 选择元素

Question

我正在尝试使用 Capybara 在以下 HTML 结构中选择 td.col_4，但到目前为止无济于事：

<div id="potentialResults">
  <div class="result">
    <table class="report">
      <tbody>
        <tr>
          <td class="col_1">
           <img original-title="Sources : Telephone Directory">
             <a href="#"><u>Name 1</u></a>
          </td>
          <td class="col_2"></td>
          <td class="col_3"></td>
          <td class="col_4">Address 1</td>
        </tr>
      </tbody>
    </table>
  </div>

  <div class="result">
    <table class="report">
      <tbody>
        <tr>
          <td class="col_1">
           <img original-title="Sources : Telephone Directory">
             <a href="#"><u>Name 2</u></a>
          </td>
          <td class="col_2"></td>
          <td class="col_3"></td>
          <td class="col_4">Address 2</td>
        </tr>
      </tbody>
    </table>
  </div>

 </div>

所以目前要为Name 1 获取文本address 1 我这样做

page.find("#potentialResults > .result > .report > tbody > tr > td.col_1 > a", text: "Name 1", match: :first).find('td.col_4').text

但我似乎在苦苦挣扎的地方是获取相同的地址，但使用 img 数据属性作为我的标识符

page.find("#potentialResults > .result > .report > tbody > tr > td.col_1 > img[original-title='Sources : Telephone Directory'] + td.col_4",  match: :first).text

但td.col_4 在本例中并不完全相邻，是吗？

当规定它必须是第一个匹配时，我还能如何获取文本？

Answer 1

您传递给查找器的 css 太长了。可以缩短它而不会产生模棱两可的结果。

如果您只想从 td.col_4 获取文本，只需执行以下操作：

find('#potentialResults .col_4').text

如果您想要“名称 1”的地址，您需要首先找到该元素，向上遍历几级到父元素，然后找到返回的路径。这是因为您要查找的元素是同级元素，而 Capybara 并没有真正提供一种简单的方法来查找这些元素：

find('#potentialResults .col_1 a', :text => 'Name 1').find(:xpath, '../../..').find('.col_4').text