Question

我想重新提出here和here提出的关于在使用selenium的Nightwatch.js中测试文件上传的问题。

两个链接都有建议的解决方案，即将文件输入元素的值设置为url。在我的用例中，我一直无法使用它。即使在夜间守望之外手动设置值type="file"输入的值标签也不会更改网址。我在开发工具中的Chrome，Firefox和IE10上试过这个。

我看过的另一种解决方案是尝试模拟整个文件上传过程的击键。这将遵循单击文件上载按钮，键入路径和键入enter的路径。这可以通过.click和.key方法完成。但是，您将失去实际文件上载窗口的焦点，这会延迟按键直到该窗口关闭。其他开发人员似乎能够使用java中的.findElement和.sendKeys方法直接在selenium中修复此解决方案，但我无法弄清楚如何在javascript和nightwatch本身中执行此操作。

有什么想法吗？

// My test
      module.exports = {
      "Standard File Upload" : function (browser) {
        browser
          .url("http://localhost:3000")
          .waitForElementVisible('body', 1000)
          .waitForElementVisible('input[type="file"]', 1000)
          .setValue('input[type="file"]','http://localhost:3000/testfile.txt')
          .click('#submit')
          .pause(1000)
          .assert.containsText('h3', 'File Uploaded Successfully')
          .end();
      }
    };

// http://localhost:3000/testfile.txt was tested manually in the file upload window and worked successfully

<!-- My input tag --> 
<input id="fileUpload" type="file" name="textfile"/>

Answer 1

我的setValue()方法实现存在两个单独的问题。

在nightwatch命令中使用--verbose标记让我遇到了问题在那里它实际上没有找到输入标签 setValue()，但是在waitForElementVisible()期间。将input[type="file"]更改为input#fileUpload解决了这个问题问题。
其次，以下描述路径的方式不起作用......
- 'textfile.txt'
- 'http://localhost:3000/testfile.txt'（如果手动输入文件上传窗口，则会有效）
使用require('path').resolve(__dirname + '/testfile.txt')

看看here，看看导致修复的讨论。谢谢richard-flosi。

工作代码：

module.exports = {
  "Standard File Upload" : function (browser) {
    browser
      .url("http://localhost:3000")
      .waitForElementVisible('body', 1000)
      .waitForElementVisible('input#fileUpload', 1000)
      .pause(1000)
      .setValue('input#fileUpload', require('path').resolve(__dirname + '/testfile.txt')) // Works
//      .setValue('input#fileUpload', "testfile.txt") // Will not work
//      .setValue('input#fileUpload', "http://localhost:3000/testfile.txt") // Will not work
//      .setValue('input[type="file"]', require('path').resolve(__dirname + '/testfile.txt')) // Will not work
      .click('#submit')
      .pause(1000)
      .assert.containsText('h3', 'File Uploaded Successfully')
      .end();
  }
};

Answer 2

我不确定你为什么会遇到这些问题，也许会检查你是否使用了最新版本的selenium服务器和夜视仪。此代码在Chrome，Safari，Firefox，IE7 / 8/9/10/11中100％适用于我（未在IE6中测试，但也可以考虑）。

driver.setValue('input#fileUpload', __dirname + '\\testfile.txt')

Answer 3

在我的情况下，我还有一个问题，因为我尝试上传的文件在我的目录结构中太高了。

只要我将文件移动到实际测试文件的同一级别（或子目录中），就会有效。

来自我page-objects文件夹中的脚本：

// No dice:
var fullPath = require('path').resolve(__dirname + '/../../somefile.pdf');

// Works:
var fullPath = require('path').resolve(__dirname + '/../somefile.pdf');

this.setValue('input#fileUpload', fullPath);

在Nightwatch.js中进行文件上传测试

3 个答案: