使用茧和水豚上传多个文件答案

【问题标题】：Multiple files upload with cocoon and capybara使用茧和水豚上传多个文件
【发布时间】：2016-02-23 12:59:18
【问题描述】：

我在使用cocoon 测试通过capybara 上传多个文件时遇到问题。如何找到带有id: "image" 的所有字段并附加到每个文件？

这是我的测试代码：

  click_link "Add photo"
  wait_for_ajax

  click_link "Add photo"
  wait_for_ajax


  page.all(:class, '.attach_fileds').each do |el|
    attach_file( el, "#{Rails.root}/spec/assets/example.jpg")
  end

  click_button "Add"

  expect(Post.count).to eq(1)
  expect(Post.last.images.size).to eq(2)

错误信息： Unable to find file field #<Capybara::Element tag="input" path="/html/body/div/div/div/form[@id='new_post']/div[@id='educations']/div[1]/input[@id='image']">

【问题讨论】：

标签： ruby-on-rails capybara carrierwave capybara-webkit cocoon-gem

【解决方案1】：

你不应该有多个具有相同 id 的元素，因为那是非法的 html。根据您的示例代码（不确定 :class 选择器如此猜测），您真的希望每个元素都具有“attach_field”类。 #attach_file 不采用元素作为其第一个参数，而是采用元素的名称、ID 或标签文本。由于您已经拥有元素，因此您可以在每个元素上调用#set

page.all(:css, '.attach_field').each do |el
  el.set "path of file to upload"
end

如果你只想要你可以做的每个文件输入

page.all(:css, 'input[type="file"]').each do |el|
  el.set "path of file to upload")
end

另请注意，您需要介于 click_button "Add" 和 expect(Post.count).to eq(1) 之间的内容以使测试等待提交完成 - 类似于

expect(page).to have_text('Image Uploaded') # if the page adds text when image is uploaded

或

expect(page).to have_current_path('/some_new_path') # if the page url changes after the upload is complete

【讨论】：