Testing toObservable() in service

Question

Subcription to toObservable(signal()) does not run at all. Triend done, fakeAsync, async nothings works.

I tried to test a service that uses signals and observables. The main objective was to check if the HTTP call was sent, but I couldn't see anything. Faking a simple GET request without using RxJS interops works fine, but when I try to find the request caused by

params = signal({test: 'test'});

result = this.http.get('fake', {
    params: new HttpParams({ fromObject: { test: 'test' } }),
});

resultRxjsInterop = toObservable(this.params).pipe(
    switchMap(params =>
        this.http.get('fake', {params: new HttpParams({ fromObject: params })})
    )
);

// Check if the request was sent
const req = httpTestingController.expectOne({
    url: 'fake?test=test',
    method: 'GET',
});

In the case of subscribing to results, the test passes. However, when subscribing to resultRxjsInterop, no request is sent, nothing happens, and the subscription does not run.

Here is the repository with an example: https://github.com/Sp94dev/rxjs-interop-test

Does anyone have any idea how to test a service with toObservable?

Answer 1

I had a look at your example and figured out that this is a known problem in v16, since you are implementing a Testbed-Service-Test

Signals are currently coupled to the Change-Detection. This means, no change detection, no triggering of signals. You can only test your use case by creating a Component-Test and calling fixture.detectChanges(). However in a service test this is currently not possible..

The good news however is that there has been a PR to introduce this feature in 17.0.0-next.4: https://github.com/angular/angular/pull/51049 (and also decouple signals from the change detection)

This enables you to call Testbed.flushEffects() to essentially trigger them.

(Sadly I have no environment for v17 available myself so I cannot provide a running solution.)