使用 Capybara 测试文件上传 - 不是表单而是按钮和 javascript 函数

Question

我正在努力使该测试工作，测试了几种方法，但到目前为止没有任何效果。我有一个按钮

<div >
  <a href class="btn btn-default btn-block btn-lg btn-shadowed ut-upload-button"
    ng-file-select
    ng-file-change="uplFile($event, $file)">
    <i class="icon">i</i>
  </a>
</div>

这是一个按钮，当点击打开操作系统文件浏览器时，任何人都知道如何让它工作，因为我尝试了 attach_file, page.attach_file, find(".ut-upload-button").set(Rails.root + 'spec/文件/文件.txt'）

上传后，页面应显示祝酒成功

expect(page).to have_toast('Success')

对不起，如果这是一个基本错误或愚蠢的问题，我刚刚开始使用 rspec 和水豚，完全迷路了

Answer 1

你不能这样做，因为一旦系统文件浏览器打开，驱动程序就无法与之交互。您需要调用attach_file实际的 <input type='file'> 元素（在您的情况下可能隐藏在页面上）。由于您没有显示您的 HTML，我无法提供确切的代码 - 但假设您有一个类似以下的元素

<input type='file' name='file_upload'>

并且输入是通过某种类型的 CSS 从视图中隐藏的，然后类似于

page.attach_file('file_upload', Rails.root + 'spec/files/file.txt', make_visible: true)

应该为你工作。如果页面上只有一个文件上传，您也可以这样做

page.attach_file(Rails.root + 'spec/files/file.txt', make_visible: true)

如果您愿意尝试 Capybara 项目的 master 分支，它目前具有试用支持，可以将块传递给attach_file打开文件选择器。在您的情况下，这可能类似于

page.attach_file(Rails.root + 'spec/files/file.txt') do
  page.find(".ut-upload-button").click
end

该功能可供用户测试，并且可能会或可能不会将其纳入 Capybara 3.15（取决于据报道它与多种方式来设置文件输入样式的效果如何），当它在一个月左右发布时。