Question

我有一个AngularJS SPA，用户可以使用flow.js上传文件，更确切地说，我使用其包装ng-flow。

现在我正在使用Selenium设置自动e2e测试，但我无法在用户点击flow-btn元素时，也不知道如何测试前面提到的上传机制使用拖放。

在Google上搜索我发现this page表示网页驱动程序无法识别点击flow-btn时打开的对话框，但是，因为这最后一次不是(the only way to use a flow-btn) {1}}元素，但只是<input> {{3}}，我无法使用链接页面中建议的解决方案。

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

Answer 1

不确定这是否有帮助......我们使用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 ...

Answer 2

以下是将当前脚本上传到使用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);
  });

});

如何使用Selenium测试flow.js上传？

2 个答案: