是否有可能找出一个元素是否出现在 Capybara 中的第二个元素之前？

Question

我正在用 Caplybara、Cucumber 和 WebDriver 进行测试，所以我查看了两个相互重叠的元素，所以我想。

更简单的方法，是否可以知道一个元素是否在第二个之前？
以更复杂的方式，是否可以知道一个元素是否位于另一个元素之上？

结构简单

<div id="father-parent">
    <p id="children-0">Firt element</p>
    <p id="children-1">Second element</p>
</div>

Answer 1

如果您要验证的是 children-0 在 children-1 之前出现，您可以使用 CSS 相邻兄弟选择器

expect(page).to have_css('#children-0 + #children-1')

如果您只想验证 children-0 是 children-1 的前一个兄弟姐妹（不一定相邻），您可以使用通用兄弟姐妹选择器

expect(page).to have_css('#children-0 ~ #children-1')

Answer 2

根据测试的编写方式，您还可以使用 have_sibling 匹配器：

first_child = find('#children-0')
expect(first_child).to have_sibling('#children-1')

为了测试元素位置，一些驱动程序支持 :below filter:

expect(first_child).to have_sibling('#children-1', below: first_child)

below 是 Capybara's global filters 之一，您也可以使用 above、left_of 和 right_of.

Answer 3

如果您可以进行简单的内容匹配，我刚刚添加了一个新的匹配器 spec/support/matchers/appear_before_matcher.rb:

RSpec::Matchers.define :appear_before do |later_content|
  match do |earlier_content|
    page.body.index(earlier_content) < page.body.index(later_content)
  end
end

然后像这样使用它：

expect('First element').to appear_before('Second element')

是否有可能找出一个元素是否出现在 Capybara 中的第二个元素之前？

Is it possible to find out if an element comes before the second element in Capybara?

webdriver

cucumber

capybara