Why use "done" in Testing services doc

Description

In the Testing services doc: https://angular.io/guide/testing-services, the example uses done

  it('#getObservableValue should return value from observable',
    (done: DoneFn) => {
    service.getObservableValue().subscribe(value => {
      expect(value).toBe('observable value');
      done();
    });
  });

There are situations where done can lead to unnecessary unit test delays, as described here: https://www.piotrl.net/angular-testing-avoid-done/

We can avoid using done by writing the test this way:

  it('#getObservableValue should return value from observable', () => {
    let result;
    service.getObservableValue().subscribe((value) => {
      result = value;
    });
    expect(result).toBe('observable value');
  });

And if service.getObservableValue() is asynchronous, we can use fakeAsync:

  it('#getObservableValue should return value from observable', fakeAsync(() => {
    let result;
    service.getObservableValue().subscribe((value) => {
      result = value;
    });
    tick(); // or tick(whatevertimeneeded); whatevertimeneeded being a number representing milliseconds
    expect(result).toBe('observable value');
  }));

I think done should be avoided in Angular unit tests since we have better alternatives. I am curious about what the Angular team and the Angular community think.

What is the affected URL?

https://angular.io/guide/testing-services

Please provide the steps to reproduce the issue

take a look at the doc

Please provide the expected behavior vs the actual behavior you encountered

don’t use done

Please provide a screenshot if possible

Please provide the exception or error you saw

No response

Is this a browser-specific issue? If so, please specify the device, browser, and version.

No response

[Airblader]

I didn’t want to start a bigger discussion here, so I’ll refrain from driving that further; but just an unopinionated note that there is precedence for your suggestion in Angular already, see https://angular.io/api/core/testing/fakeAsync#example.

For the sake of beginners I’d personally like to see there being utilities such as a function that subscribes to an observable and collects all values and returns them. Ideally this could detect that it is run in fakeAsync and throw a helpful error otherwise; that way the problematic pattern is hidden from the user, it looks better in code and it is protected against usage outside fakeAsync. But such an idea is outside the scope of this issue.

[Airblader]

@dereklin Well, exactly the version you are proposing to use. It works only if the observable is synchronous, which observables typically are not, and will only be in tests due to fakeAsync. Outside of tests, writing the code this way is essentially always wrong, and there are hundreds of questions on Stack Overflow about it.