我正在使用RSpec
和capybara-webkit
改进我的测试,尝试删除所有css
和xpath
选择器,例如
find('#edit_user > div:nth-child(7) > div > div > button').click
我正在寻找替换它们的最佳选择。
我打算使用css class
元素,但有些" pro" Capybara测试员说这不是最好的选择。
所以我的问题是:我可以在测试中使用data
属性吗?
如果我有一个元素
<button name="button" type="submit" class="button last" data-test="edit.update">Update/button>
我能做到吗
find('edit.update').click
你觉得这是个好主意吗?如果您对此主题有更多想法/信息,请随时发表评论!
答案 0 :(得分:19)
要按data- *属性定位元素,您需要使用CSS选择器或XPath。
对于CSS选择器:
find('button[data-test="edit.update"]').click
对于XPath:
find('//button[@data-test="edit.update"]').click
这是否是一个好主意实际上取决于应用程序。您想要选择唯一标识元素的内容。如果&#34; edit.update&#34;不会是独一无二的,它不是一个好用的选择。如果按钮有一个唯一的类,那么class
属性就可以了,&#34;按钮&#34;和&#34;最后&#34;不太可能。
最好的方法是使用静态id
属性,因为它们在页面中应该是唯一的,并且不太可能更改。 find
方法还支持按id定位元素,这意味着您不必编写CSS选择器或XPath。
答案 1 :(得分:13)
Justin Ko给出的答案是正确的,我只是想添加一些更先进的东西,这有助于在某些情况下测试可读性。你可以将你自己的“选择器”添加到Capybara,所以如果你真的想通过数据测试属性来选择东西(不是一个好主意,因为你真的不想为测试添加属性),你可以做很多事情
Capybara.add_selector(:dt) do
css { |v| "*[data-test=#{v}]" }
end
允许
find(:dt, 'edit.update')
这可以使测试变得易于理解,同时还将复杂的css或路径查询限制在测试代码中的单个位置。然后,您可以定义一个方法,例如
def find_by_dt(value)
find(:dt, value)
end
如果您更喜欢find_by_dt的外观...)来查找(:dt,...)
您还可以为自己的选择添加过滤器和说明,以获得更多灵活性,更好的错误说明等 - 有关由capybara提供的内置选择器,请参阅https://github.com/jnicklas/capybara/blob/master/lib/capybara/selector.rb