File Upload Testing in Nightwatch.js

Question

I\'d like to reopen the question posed here and here about testing file uploading within Nightwatch.js which uses selenium.

Both links have the recommended solutio

Answer 1

I'm not sure why you're having these issues, maybe check to see if you are using the latest version of selenium server and nightwatch. This code works for me 100% in Chrome, Safari, Firefox, IE7/8/9/10/11 (not tested in IE6 but assume it as well).

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

Answer 2

In my case, I had an additional problem because the file I was trying to upload was too high up in my directory structure.

As soon as I moved the file to the same level (or in a subdirectory of) the actual test files, things worked.

From a script living in my page-objects folder:

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

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

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

Answer 3

There were two seperate issues with my setValue() method implementation.

1. Using the --verbose tag in the nightwatch command led me to an issue where it was not actually finding the input tag during the setValue(), however it was during the waitForElementVisible(). Changing input[type="file"] to input#fileUpload solved this issue.

2. Secondly, the following ways of describing the path were not working...

   • 'textfile.txt'
   • 'http://localhost:3000/testfile.txt' (Will work if typed manually into file upload window)

   
   What did work was using require('path').resolve(__dirname + '/testfile.txt')

Take a look here to see the discussion that led to the fix. Thanks goes out to richard-flosi.

The working code:

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();
  }
};