点击基于ID的链接和capybara

时间:2017-03-09 17:31:17

标签: html ruby-on-rails rspec capybara

我在表格中有两行,每行都有一个'预览'我想用Capybara进行测试的按钮,但是我很难弄清楚如何单独点击每个预览按钮。我是Capybara的新手,所以我还在学习。这是表格的样子

<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的按钮

2 个答案:

答案 0 :(得分:4)

与Capybara一样,有多种方法可以做某事,但我们应该首先清理一些事情。预览“按钮”实际上是一个链接(即使您将其设置为按钮,它仍然是一个&lt; a&gt;元素),所以如果走click_xxx路线,您需要使用click_linkclick_link_or_buttonclick_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

第一种解决方案将来会更容易理解,第二种解决方案更少。如果这是我的代码,我会将data-cta_id属性放在&lt; tr&gt;上元素,因为整行指的是“cta”,然后做了类似

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

在测试中。

答案 1 :(得分:0)

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

类似find("[data-cta_id='2'"])的内容,可以使用id 2获取元素。