Einheit Testdatei Upload in eckig

Question

Ich benutze das Nf-Datei-Upload-Modul, um eine Datei auf mein Backend hochzuladen. Der Code für das Hochladen der Datei lautet wie folgt:

$scope.upload = function (file) { 
      console.log(file) 

      Upload.upload({ 
       url: 'http://localhost:3000/fileupload', 
       data: {file: file[0]}, 
      }).then(function (resp) { 
       console.log('Success ' + resp.config.data.file.name + ' uploaded. Response: ' + resp.data); 
} 

Das Hochladen der Datei funktioniert hervorragend. aber wenn ich meine Komponententest erstellen:

it('should send file to backend for processing', function(){ 
    var mockFile = {file:[{"name":"file.bin", "size":1018, "type":"application/binary"}]}; 
    httpBackend.when('POST', 'http://localhost:3000/fileupload').respond(200, {"filePath":"http://localhost:3000/uploads/file.txt"}); 
    scope.upload(mockFile); 
    httpBackend.flush(); 
    }); 

Ich erhalte eine Fehlermeldung:

TypeError: undefined is not an object (evaluating 'resp.config.data.file.name') 

Was mache ich falsch?

Answer 1

Die then Methode mit dem resp Argument. In den normalen Bedingungen, erhalten Sie ein Objekt, das die Struktur hat: { config: { Daten: { Datei: { Namen: 'a name'}} } }

aber in Ihr Test antworten Sie nicht mit der gleichen Struktur.

BEARBEITEN: Ok. Ich habe das verstanden. die Art und Weise, wie ng-file-uploader die Daten zurückgibt, die nicht zum Vorschein kommen. Sie erhalten den Namen der Datei nicht in der Datei resp.data.config.file.name. Stattdessen wird der Dateiname in einer Variablen gespeichert, bevor die Datei hochgeladen wird. So:

$scope.upload = function (file) { 

     var fileName = file.name; 

     Upload.upload({ 
     url: 'http://localhost:3000/fileupload', 
     data: {file: file[0]}, 
     }) 
     .then(function (resp) { 

     console.log('Success ' + fileName + ' uploaded. Response: ' + resp.data); 
    }); 

    }; 

prüfen diese codepen codepen.io/gpincheiraa/pen/MyrvQK Viel Glück!

Answer 2

Sie müssen einen Digest-Zyklus ausführen.

it('should send file to backend for processing', function(){ 
    var mockFile = {file:[{"name":"file.bin", "size":1018, "type":"application/binary"}]}; 
    httpBackend.when('POST', 'http://localhost:3000/fileupload').respond(200, {"filePath":"http://localhost:3000/uploads/file.txt"}); 
    scope.upload(mockFile); 
    httpBackend.flush(); 
    scope.$digest(); 
    }); 

Dies wird die Versprechen lösen und die Rückkehr Daten auslösen.