Angular 6：使用Karma单元测试异步文件导入

Question

基本上，我试图用Karma单元测试我的异步文件导入功能，但不知怎的，我不能让它工作。

假设我有以下函数来导入文件。用户单击按钮，从而打开操作系统文件对话框。然后用户选择要导入的文件并按下确定。

1. 读取文件并将其存储在后端

public handleTheProcess(event){
  // set this.file with a selected file
  this.file = <File>event.type.target.files[0];
  this.sendFileToBackend(this.file);
}

public sendFileToBackend(file: File){
  if(file){

   // create a FormData obj since the file comes from a MultiPart file
   const formData = new FormData();
   formData.append( // append the file...);

   // send file to the backend via a POST reqest
   this.http.post(...)
    .subscribe( event => { // Do some status checks..
      return true;
    }, (error: HttpErrorResponse) => {
        return false;
      });
  } else {
     // something unexpected happend
     return false;
   }

为了测试它，我尝试了这个：

用于测试导入功能的单元测试

// basic configureTestSuite configs generated by Angular itself
// ...
//...
describe("Request should return true because we pass a valid file", () => {
  fit("return false", fakeAsync(() => {
    event = {};
    event.target = {};
    event.target.files = [];

    event.target.files.push( new File(["Excel file content"], "Mock.xlsx", { type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet" }));

    const formData = new FormData();
    formData.append("file", event.target.files[0], event.target.files[0].name);

    // import the mocked file
    const result = component.sendFileToBackend(event.target.files[0]);
    httpMock.expectOne(...).flush(formData, {status: 200, statusText: "Okayo"});
    tick();
    expect(result).toBeTruthy();
  }));
}

我错过了什么？由于我传递了一个有效参数，因此AFAIK，result变为真。但expec(result).toBeTruthy()由于某种原因失败了。

如果您需要更多信息，请与我们联系。

任何帮助表示赞赏。

最好的，大家伙

Answer 1

此测试永远不会成功，因为函数sendFileToBackend()永远不会返回true。你在函数中唯一拥有return true语句的地方是在一个订阅中，它只对它所在的函数返回true，而不是外部的sendFileToBackend()。

你的编辑应该为你了解这个事实。尝试为您的函数定义返回值，如下所示：

public sendFileToBackend(file: File): boolean {
/* rest of function */

您的编辑器应该抱怨您没有从编码的函数返回布尔值。