How to test the upload of .csv file in protractor

Question

I'm trying to test an upload of a csv file in protractor. For which I have the following code:

const absolutePath = path.resolve(__dirname, 'csvFile.csv');

const fileInput = element(by.css('input[type=file]'));

browser.wait(until.presenceOf(fileInput), 5000, 'File input not found');

fileInput.sendKeys(absolutePath);

browser.wait(until.presenceOf(mockPage.uploadBtn));
mockPage.uploadBtn.click();

But it always throws jasmine timeout. My input field is found, so that's not the problem. And the value of absolutePath it's correct!

./home/user/project/src/test/javascript/e2e/entities/csvFile.csv

My html input code is:

<input  id="input-file" type="file" (change)="setFileData($event,'file', false)"  />

What I've tried:

• Passing the path as './csvFile.csv'
• Trying to upload a .png file to see if the extension was the problem.
• Searching my input by id to see if there was an error finding the input.

For all these cases the same thing happened, jasmine timeout when writing the path into the input.

Anyone has an idea of what could be the problem? Thanks in advance!

Answer 1

I found the solution, the change event was called for every key send by the sendKeys() method, causing lots of troubles.

I solved it by adding this to the setFileData() function:

if (event.target.files[0].name.endsWith('csv')) {
        // Do the magick
    }

So it waits until the file name is fully written.