如何使用 WebdriverIO 上传文件

Question

我正在尝试将以下代码从使用 selenium-webdriver gem 的 Ruby 移植到使用 WebdriverIO 的 Node.js：

@webdriver.navigate.to "https://imgur.com/upload"
element = @webdriver.find_element(:id, 'global-files-button')
element.send_keys("C:\test\image.png")

如您所见，代码非常简单：导航到 url，找到输入，设置文件路径，然后按预期方式选择要上传的文件。

这是我移植的版本：

describe('User can upload', () => {
  it('select file', () => {
    browser.url("https://imgur.com/upload");
    browser.waitForExist('#global-files-button');
    $('#global-files-button').keys("C : \ t e s t \ i m a g e . p n g".split(" "));
  });
});

不幸的是，这个测试没有设置路径，我还没有找到一个使用 wdio 上传这样的文件的工作示例，文档让我猜测。非常感谢任何建议。

我知道 chooseFile 和 uploadFile，但我正在使用云平台来运行我的 wdio 测试，它们似乎无法可靠地工作。

Answer 1

// c:/test/image.png
var test1 = 'c:/test/image.png'
var path = test1.split('/').join('\\')
browser.addValue('[name="fileField"]', path )

或许这也行得通

// c:\test\image.png
var path = 'c:\test\image.png'
browser.addValue('[name="fileField"]', path )

或者这个

// c:/test/image.png
var path = 'c:/test/image.png'
browser.addValue('[name="fileField"]', path )

Answer 2

我遇到了麻烦。根据我的研究，这不是 WebdriverIO 的问题，也不是 chooseFile() 或 uploadFile() 方法的问题。我认为问题的根源归结为 Selenium Webdriver 无法处理 'multiple' <input type='file' multiple> 上传元素的错误。

在遇到这个 github 问题之前，我为此奋斗了大约 3 天： https://github.com/SeleniumHQ/selenium-google-code-issue-archive/issues/2239

长话短说，因为 imgur 上的 HTML 上有 "multiple" 属性，您的上传测试将无法正常工作。根据我的观察，WebdriverIO / Selenium 刚刚停止运行。

注意：在测试 <input type='file' multiple> 时，我实际上已经能够让我的应用程序上传单个文件并将文件添加到我的系统和应用程序。然而，问题是 WebdriverIO 和 Selenium 刚刚停止。测试结束，不报告任何成功或失败结果。

如果您去测试另一个未指定为 "multiple" 上传输入字段的 <input type=file> 元素，您应该能够使 WebdriverIO 中的 chooseFile() 方法正常运行。

我希望这对您以及可能遇到文件上传问题的任何其他人有所帮助。

编辑：我已经尝试让您的示例工作，并且我成功地使用 "chooseFile()" 并将 "filepath" 直接传递给它。或许您正在尝试在不需要时发送键盘命令？您是否有您尝试上传的图片的直接文件路径？以下是我能够用来成功上传文件的内容。

it('upload a file to imgur', function () {
    browser.url("https://imgur.com/upload");
    browser.waitForExist('#global-files-button');
    browser.chooseFile('#global-files-button', '/insert/path/to/image.png')
})

如何使用 WebdriverIO 上传文件

How to upload a file using WebdriverIO

node.js

selenium-webdriver

webdriver

webdriver-io