Testing 如何使用Capybara和Dropzone.js测试上传文件？

我已经切换到使用该插件进行拖放文件上传。如何编写水豚测试以确保此功能继续工作

以前我有一个带有输入文件元素的模板：

<input type="file" name="attachments">

---

但是，这不再有效，因为Dropzone没有可见的文件输入。

要解决此问题，请模拟drop事件以触发将附件拖放到Dropzone。首先将此函数添加到步骤定义中：

#将文件上载到Dropzone.js
def drop_在_dropzone中（文件路径）
#生成一个假输入选择器
page.execute_script如果有人感兴趣，我将@deepwell的函数移植到javascript中，与javascript风格的selenium一起使用：

this.dropInDropzone=函数（filePath）{
var script=“fakeFileInput=$（'#fakeFileInput'）；if（fakeFileInput.length==0）fakeFileInput=window.$（''）.attr（{id:'fakeFileInput'，type:'file'}）。appendTo（'body'）；
//生成一个假输入选择器
返回driver.executeScript（脚本）.then（函数（）{
//将文件附加到假输入选择器
返回driver.findElement（webdriver.By.css（'#fakeFileInput'））.sendKeys（filePath）；
}).然后（函数（）{
//将文件添加到文件列表数组
返回driver.executeScript（“var fileList=[fakeFileInput.get（0）.files[0]]”；
}).然后（函数（）{
//触发假掉落事件
script=“var e=jQuery.Event（'drop'，{dataTransfer:{files:[fakeFileInput.get（0）.files[0]]}）；$（'.dropzone'）[0]。dropzone.listeners[0]。events.drop（e）；”
返回驱动程序.executeScript（脚本）；
});
};
基于@deepwell的答案，这个答案对我不太适用，下面是一个使用vanilla JS进行事件和事件调度的解决方案，以及dropzone的中性选择器：

def-drop\u-in\u-dropzone（文件路径、区域选择器）
#生成一个假输入选择器
这些天来，我发现这种方式更加优雅

page.attach_file(Rails.root.join('spec/fixtures/files/avatar.png')) do
  page.find('#avatar-clickable').click
end

在我的例子中，
#avatar clickable
是一个包含Dropzone表单标签的div。
OP要求的是水豚，而不是JS。这将更好地作为对所选答案的注释的要点。似乎每个页面可能会以不同的方式实现dropzone，我们需要对该脚本进行一些自定义以使其正常工作。在我的例子中，它与“originalEvent”属性
var e=jQuery.Event（'drop'，{dataTransfer:{files:[fakeFileInput.get（0）.files[0]]}）有关你不能只做
var e=jQuery.Event（'drop'，{dataTransfer:{files:fileList}}）这是一个完全的祝福。谢谢。从2019年5月开始更新：这仍然可以完美工作，无需任何更改。非常感谢！我更改了以编程方式访问dropzone的最后一个块，并删除了伪输入，以便您可以在同一个区域上多次调用它<代码>var e=jQuery.Event（“drop”，{dataTransfer:{files:[fakeFileInput.get（0）.files[0]]}）；Dropzone.instances[0].侦听器[0].事件.drop（e）$（#fakeFileInput”）.remove（）我无法让它工作，它说fakeFileInput.get不是函数。我想我在测试中没有正确加载jquery？我发现这个gem工作得很好，而不是
Rails.root.join（'spec/fixtures/files/avatar.png'）
你应该能够做
file\u fixture（'avatar.png'）
。
page.attach_file(Rails.root.join('spec/fixtures/files/avatar.png')) do
  page.find('#avatar-clickable').click
end