title: How to wait for callback function in angular6+ unit test (Jasmine+karma)
body: <hr>
  
  <p><strong>Update:</strong></p>
  
  <p>This seems issue with FileReader. Found this <a href="https://github.com/angular/angular/issues/31702" rel="nofollow noreferrer">link</a></p>
  
  <p>Can anyone suggest how can I write unit test for FileReader related thing</p>
  
  <hr>
  
  <p>I have instance where I have callback inside observable subscribe callback.</p>
  
  <p>Component.ts</p>
  
  <pre><code> public ngOnInit(): void {
   this.subscriptions.push(this.route.paramMap.subscribe((params: ParamMap) =&gt; {
   this.service.getAttachment()
        .subscribe(response =&gt; {
            this.convertBlobToBase46String(response.contentBytes, 
            async (data) =&gt; {
                this.fileData = data;
            });
          this.isAttachmentLoadingCompleted = true;
        }, error =&gt; {
          this.isAttachmentLoadingCompleted = true;
          this.loggingServie.logError(error, 'Error occurred while fetching attachment.');
        });
   }));
  }
  
   private convertBlobToBase46String(resp, callback) {
           const reader = new FileReader();
           reader.onload = function () {
                          callback(reader.result);
                          };
           reader.readAsDataURL(resp);
      }
  
  public isAttachmentVisible(): boolean {
         if (this.fileData != null &amp;&amp; this.isAttachmentLoadingCompleted) {
             return true;
           }
  
        return false;
  }
  </code></pre>
  
  <p>component.spec.ts</p>
  
  <pre><code>it('should hide attachment if attachment is not visible', fakeAsync(() =&gt; {
    let content = "Hello World";
    let data = new Blob([content], { type: 'text/plain' });
    let arrayOfBlob = new Array&lt;Blob&gt;();
    arrayOfBlob.push(data);
    let file = new File(arrayOfBlob, "Mock.svc");
  
    spyOn(service, 'getAttachment').and
      .returnValue(Observable.of({ mimeType: 'text/plain', contentBytes: file }));
  
    component.ngOnInit();
    fixture.detectChanges();
    tick(40);
  
    const returnValue = component.isAttachmentVisible();
  
    expect(returnValue).toBe(true);
    }));
  </code></pre>
  
  <p>Here <code>fileData</code> is set inside callback function and it is used in <code>isAttachmentVisible()</code> method so it should wait for callback to complete. But it doesn't wait for it, even though I increased tick value, it calls <code>isAttachmentVisible()</code> before seting <code>fileData</code></p>