Question

我如何用水豚用within选择一个项目？

我有以下HTML

<div id ="projects"> 
  ...
  <div class="card">lorem</div>
  <div class="card">ipsum</div>
</div>

我需要使用class='card'选择第二个div。

  within(:css, '#attachments') do
    within(:css, '.card') do
     expect(page).to have_text('ipsum')
    end
  end

但不确定如何做到这一点。

Answer 1

您可以使用

within all(:css, ".card")[1] do
  expect(page).to have_text('ipsum')
end

顺便说一句，如果您没有在default_selector中设置其他spec_helper.rb，例如

Capybara.default_selector = :xpath

您可以使用

within all(".card")[1] do
 expect(page).to have_text('ipsum')
end

因为默认情况下，水豚将:css用作default_selector。

Answer 2

有很多方法可以选择元素，具体取决于两个div之前...文档的结构（还有其他div等）。 @fabersky的答案显示了一种不依赖于该结构的方法，即使用all并索引到结果（all('.card')[1]中）-如果页面是高度动态的，则可能想要指定类似（all('.card', minimum: 2)[1]）的最小值。另一种选择是编写一个XPath只匹配正确的元素（通常更好的做法是选择使用单个返回元素的选择器，而不是使用all并尽可能地索引结果）。

within(:css, '#attachments') do
  within(:xpath, XPath.css('.card')[2]) do
    expect(page).to have_text('ipsum')
  end
end

在这种情况下，[2]是XPath表达式的一部分（变为.//*[contains(concat(' ', normalize-space(@class), ' '), ' card ')][2]），因此索引的确从1开始。

多个元素匹配时指定元素

2 个答案: