Protractor click link and compare server response with file

Question

I'm building a system where users upload files. I've managed to test the file uploading with Protractor, but now I need to verify that when requesting the raw file from the server the response is the same as the uploaded file.

A user downloads the file by clicking a link, which triggers a normal GET request for the file. Since I'm dealing with plain text files, the downloaded file is not served as an attachment but instead displayed in the browser. The relevant PHP code is:

header('Content-Type: text/plain');
header('Content-Length: ' . $file->getSize());
header('Content-Disposition: filename="file.txt"');

$file->openFile('rb')->fpassthru();

I've got two problems:

1. How do I make protractor wait until the entire file has been downloaded?
2. How do I compare the downloaded file to what I uploaded?

Here's what I got so far:

var path = require('path');

function uploadFile(filename) {
    var absolutPath = path.resolve(__dirname, filename);
    $('input#fileupload').sendKeys(absolutPath);
}

describe('Download', function() {

    it('should be exactly the same as an uploaded text file', function() {
        uploadFile('data/2.txt');

        browser.wait(function() {
            return element(by.id('download-button')).isPresent();
        });

        element(by.id('download-button')).click();

        // Wait until page is loaded
        // Compare uploaded file with downloaded file
    });
});

Answer 1

sendKeys as most other protractor API calls returns a promise. So the correct way would be to let your uploadFile helper method return that promise, and then use then to take the next step.

I haven't tried this, but here is some code that might work:

function uploadFile(filename) {
  var absolutPath = path.resolve(__dirname, filename);
  return $('input#fileupload').sendKeys(absolutPath);
}

describe('Download', function() {

  it('should be exactly the same as an uploaded text file', function() {
    uploadFile('data/2.txt').then(function () {
      // add test code here if you want to
      ...
      element(by.id('download-button')).click().then(function () {
        // now you should be all set to do your test
        ...
    });
  });
});