CODEWITHSUNDEEP
node.jsseleniumselenium-webdriverwebdriverwebdriver-io
Mod Mark
Mod Mark

Reputation: 209

webdriverio (javascript) - upload an image

so i'm writing a test to upload an image with webdriverio javascript

http://webdriver.io/api/utility/chooseFile.html

I'm guessing this is the command I use, can someone provide me with an example on how to do this?

thanks

Upvotes: 0

Views: 2669

Answers (3)

Mahadev Gouda
Mahadev Gouda

Reputation: 817

I am trying to upload a csv here, same might work for any type of file as well Here is the documentation link: https://webdriver.io/docs/api/browser/uploadFile/#usage

const filePath = path.join(process.cwd(), "/utilities/", "test.csv");
const remoteFilePath = await browser.uploadFile(filePath);
await browser.$("//input[@type='file']").addValue(remoteFilePath);
await browser.$("//button//span[contains(text(),'Submit')]").click();

Upvotes: 0

Seema Nair
Seema Nair

Reputation: 165

To upload image,

  1. First create a folder named 'resources' in your project directory and save the image in that directory

  2. Use the below code to upload the file . In the third line, you need to replace the selector with the one on your application. Please note that if there is a button like "Upload" or "Add Photo" in the application, you need not perform click on this button before adding the below code. 

    var path = require("path");
var toUpload = path.join(__dirname, "..", "resources", 
"CompanyPic.jpg");
browser.chooseFile('input[type="file"]', toUpload);

Upvotes: 0

Gary
Gary

Reputation: 2916

This is the example in the integration test.

describe('choosing a file in an <input type=file>', function() {
    before(h.setup());

    var path = require('path');
    var toUpload = path.join(__dirname, '..', '..', 'fixtures', 'cat-to-upload.gif');

    it('uploads a file and fills the form with it', function() {
        return this.client.chooseFile('#upload-test', toUpload).catch(function(err) {
            assert.ifError(err);
        }).getValue('#upload-test').then(function(val) {
            assert.ok(/cat\-to\-upload\.gif$/.test(val));
        });
    });

    it('errors if file does not exists', function() {
        return this.client.chooseFile('#upload-test', '$#$#940358435').catch(function(err) {
            assert.notEqual(err, null);
        });
    });
});

client.chooseFile(selector,localPath).then(callback);

The first parameter is the selector (id of your input field), second parameter is path to the file you will upload.

You just need to click submit to upload the file. Note that it probably won't work everywhere. The required file endpoint is not even documented in the Selenium project.

Upvotes: 2

Related Questions