如何使用 WebdriverIO 上传文件

Posted 2023-02-16

【中文标题】如何使用 WebdriverIO 上传文件

【英文标题】：How to upload a file using WebdriverIO

【发布时间】：2018-03-07 21:00:39

【问题描述】：

我正在尝试将以下代码从带有 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 测试，但它们似乎不能可靠地工作。

【参考方案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 )

【参考方案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()”并将“文件路径”直接传递给它。也许您正在尝试发送键盘命令，而实际上并非如此？您是否有尝试上传的图像的直接文件路径？以下是我能够用来成功上传文件的内容。

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')
)