Question

在Capybara中，您可以隐含地等待元素与

一起出现

find('.slide', visible: true)

如何检测到新的/不同的幻灯片可见？所以我可以做一些目前无效的事情（Capybara在隐藏之前找到当前的.slide，而不是等待当前幻灯片隐藏并显示新的幻灯片）：

3.times do
  find('.slide').fill_in('image[description]', with: 'foo')
  click_link 'Next slide'
end

例如

我有这样的标记：

<ul>
    <li class="slide active" style="background: green;">
    </li>
    <li class="slide" style="background: blue;">
    </li>
    <li class="slide" style="background: pink;">
    </li>
</ul>
<a href="#" class="next-slide">Next slide</a>

我有一些javascript来隐藏活动幻灯片并在下一张幻灯片中淡出：

$(document).ready(function() {
    $('.next-slide').click(function(evt) {
        evt.preventDefault();
        var $activeSlide = $('.slide.active');
        $activeSlide.next().addClass('active');
        $activeSlide.hide().removeClass('active');
    });   
});

完成JSFiddle：http://jsfiddle.net/epylinkn/fQHmf/1/

Answer 1

最简单的选择可能是为每张幻灯片添加一个额外的类或ID - 即

<ul>
    <li class="slide slide-0 active" style="background: green;">
    </li>
    <li class="slide slide-1" style="background: blue;">
    </li>
    <li class="slide slide-2" style="background: pink;">
    </li>
</ul>

3.times do |i|
  find(".slide-#{i}", visible: true).fill_in('image[description]', with: 'foo')
  click_link 'Next slide'
end

Answer 2

实际上你可以在不修改应用程序源代码的情况下完成它：

(1..3).each do |i|
  find("ul > .slide.active:nth-child(#{i})").fill_in('image[description]', with: 'foo')
  click_link 'Next slide'
end

find("ul > .slide.active:nth-child(#{i})")会等到i幻灯片变为活动状态，这就是你想要的。

此代码假定ul的前3个孩子是幻灯片。

在Capybara中，如何让#find等待出现带有SAME类的DIFFERENT元素？

例如

2 个答案: