Capybara,capybara-webkit和自定义文件上传表单

Question

我使用以下html堆栈创建了自定义上传表单:

<form>
  <label></label>
  <input type="file">
</form>

文件字段通过带有display: none属性的css隐藏.因此,用户在单击标签(自定义样式)时会调用文件附加对话框.

在我的功能测试中,我无法附加文件,因为隐藏了输入字段.我尝试了几种可能的解决方案,但它们都不起作用:

find(:xpath, '//input', visible: false).set(some_file_path)

要么

within('form') do                                                                                                                                                                       
  attach_file(:input, some_file_path, visible: false)                                                                                                                                          
end

还有很多其他人.所有的时间我最终都无法点击未知位置错误的元素.删除与输入字段重叠的标签后,将其显示为可见并运行我的规范.所以这里的问题是:

1. 输入文件字段具有display: none属性(因此无法找到)
2. 有一个标签与隐藏文件字段重叠(可能)

有没有办法让Capybara与Capybara-webkit驱动程序以一些理智的方式处理这种微妙的情况？

Answer 1

使用capybara-webkit,您可以告诉驱动程序在页面上下文中运行您想要的任何JavaScript,因此您可以编写一些自定义内容来解决可见性问题:

script = "$('thelabel').toggle(); " # hide the label
script << "$('myfield').toggle();"  # show your field

page.driver.browser.execute_script(script)

这是伪代码,但您应该能够执行类似的操作,以便在调用之前使字段可见attach_file.

也就是说,每次(我至少)在我的测试中做一些有点粗略的事情,最好快点一下,询问是测试还是需要修复的界面.如果您对界面感到满意,您应该能够使用上面的小js片段来获得测试中可见的元素.

更新:

对这种行为的支持已经变得更加普遍,现在在水豚中已经标准化了,所以你可以:

page.execute_script(script)

这个较短的版本应该与capybara 2.x和最近版本的capybara-webkit或poltergeist一起使用,这是我现在使用的低依赖性替代方案.

还有一个合作伙伴方法,evaluate_script:

result = page.evaluate_script('4 + 4');

希望这可以帮助!