3

我有一个 AngularJS SPA，用户可以使用flow.js上传文件，更准确地说，我正在使用它的包装器ng-flow。

现在我正在使用 Selenium 设置自动化 e2e 测试，但我无法弄清楚如何在用户单击flow-btn元素时或使用拖放时测试上述上传机制。

谷歌搜索我发现这个页面说网络驱动程序无法识别单击 时打开的对话框flow-btn，但是，由于最后一个不是<input>元素，而只是 a <span> （使用 a 的唯一方法flow-btn），我可以'不要使用链接页面中建议的解决方案。

关于如何使用 Selenium 测试 flow.js 文件上传的任何想法？

4

2 回答 2

0

这是一个将当前脚本上传到通过以下方式实现的上传的工作示例flowjs：

const remote = require('selenium-webdriver/remote');
const path = require('path');

browser.ignoreSynchronization = true;
browser.setFileDetector(new remote.FileDetector);


describe('test suite', function() {

  it('should upload a file remotely', function() {

    browser.get('http://flowjs.github.io/ng-flow/');

    element(by.xpath("//span[.='Upload File']/input"))
      .sendKeys(path.resolve(__dirname, __filename));

    browser.sleep(5000);

    expect(element.all(by.css("div[ng-repeat='file in $flow.files']")).count()).toEqual(1);
  });

});
于 2016-04-27T20:54:45.963 回答
0

不确定这是否有帮助......我们使用 nightwatch.js 来测试我们的应用程序并为单个文件提供 flowJS 上传按钮。

为了让它工作，我必须让隐藏文件输入既可见又启用。然后我可以用文件位置填充它并提交。

一些示例 nightwatch.js

    //Re-enable traditional file-input
    this.api.execute(function () {
        document.getElementById('proof-upload-fallback').className = '';
        document.getElementById('proof-upload-fallback').disabled = false;
    });

    this.api.setValue('//input[@id="proof-upload-fallback"]', require('path').resolve(filePath));

    //Click upload
    this.api.clickModalButton('Upload');

我们的 html 看起来像：

<input id="proof-upload-fallback" type="file" flow-btn="" ng-show="false" ng-disabled="true" class="ng-hide" /> 

<button flow-btn="" focus-input="focusButton">Select PDF<input type="file" style="visibility: hidden; position: absolute; width: 1px; height: 1px;"></button>

Submit: <button ng-click="ok()">Upload</button>

ng-click="ok" 负责处理flow.js，代码的重要部分是execute()，它是JS通过selenium驱动传递给实际的webapp...

于 2016-04-27T14:28:24.850 回答