点击链接基于ID与水豚

Question

我有一个表中有两行，每个都有一个'预览'按钮，我想用水豚测试，但我很努力想出如何单击每个预览按钮。我是新来的水豚，所以我还在学习。这是表看起来像什么

<tr> 
    <td> 
     <a data-target="#1_edit_prompt" data-toggle="modal" href="#">Cta 1</a> 
    </td> 
    <td class="nowrap"> 
    Cta 1 
    </td> 
    <td class="nowrap"> 
     <a data-target="#1_uses_modal" data-toggle="modal" href="#">0</a> 
    </td> 
    <td class="nowrap"> 
    3/9/2017 
    </td> 
    <td class="actions"> 
     <a data-target="#1_edit_prompt" data-toggle="modal" href="#">Edit</a> 
     <a data-target="#1_delete_modal" data-toggle="modal" href="#">Delete</a> 
     <a class="cta-preview" data-cta_id="1" href="#">Preview</a> 
    </td> 
</tr> 
<tr> 
    <td> 
     <a data-target="#2_edit_prompt" data-toggle="modal" href="#">Cta 2</a> 
    </td> 
    <td class="nowrap"> 
     Cta 2 
    </td> 
    <td class="nowrap"> 
     <a data-target="#2_uses_modal" data-toggle="modal" href="#">0</a> 
    </td> 
    <td class="nowrap"> 
     3/9/2017 
    </td> 
    <td class="actions"> 
     <a data-target="#2_edit_prompt" data-toggle="modal" href="#">Edit</a> 
     <a data-target="#2_delete_modal" data-toggle="modal" href="#">Delete</a> 
     <a class="cta-preview" data-cta_id="2" href="#">Preview</a> 
    </td> 
</tr> 

你可以看到每个预览按钮都有data-cta_id，每个按钮都是唯一的。我想单击一个基于该ID的按钮

Answer 1

获得元素和往常一样，有多种方式做一些事情，但我们首先应该清理的东西。预览“按钮”实际上是一个链接（即使你将它看起来像一个按钮，它仍然是一个< a>元素），因此如果要使用click_xxx路线，则需要使用click_link或click_link_or_button，click_button不起作用。

你可以做的一件事是将click_link范围作为一个元素，然后使链接在该节中唯一。

page.within('#id_of_table tbody') do # scope to the specific table 
    find('tr:nth-child(1)').click_link('Preview') # click Preview in first row 
    find('tr:nth-child(2)').click_link('Preview') # 2nd row 
end 

另一种选择是由Fredius在他的回答中所示，使用属性的属性选择

find("[data-cta_id='1']").click 

第一个解决方案将是多，在未来更容易理解的差异，而在第二少代码。如果这是我的代码虽然，我将投入< TR>元素的data-cta_id属性，因为整个行是指“CTA”，然后做了类似

find("tr[data-cta_id='1']").click_link('Preview') 

测试

。

Answer 2

目前尚不清楚你到底做了什么，以及为什么你要这样做。但是你可以使用find。

喜欢的东西find("[data-cta_id='2'"])与水豚用id 2.