Search code examples
angularunit-testinginheritancejasmineangular-httpclient

Testing inheritance of httpClient in Angular 6


I have extended httpClient in an ng project in order to add a custom parameter to the options. (This works fine in my app)

My new service looks like this:

  export class CustomHttpClient extends HttpClient {

    request(first: string | HttpRequest<any>, url?: string, options: CustomHttpOptions = {}): Observable<any> {

        const res = super.request(first as string, url, options);
        res.subscribe(
            () => { // Success
                // Some action on success
            },
            () => { // error
                // Some action on error
            }
        );
        return res;
    }

    post(url: string, body: any | null, options: CustomHttpOptions = {}): Observable<any> {
        return this.request('POST', url, addBody(options, body));
    }

    put(url: string, body: any | null, options: CustomHttpOptions = {}): Observable<any> {
        return this.request('PUT', url, addBody(options, body));
    }

    patch(url: string, body: any | null, options: CustomHttpOptions = {}): Observable<any> {
        return this.request('PATCH', url, addBody(options, body));
     }
    }

      function addBody<T>(options: CustomHttpOptions, body: T | null) {
        const opts = { ...options, body };
        return opts;
      }

      export interface CustomHttpOptions {
        body?: any;
        headers?: HttpHeaders | { [header: string]: string | string[]; };
        observe?: 'body' | HttpObserve | any;
        params?: HttpParams | { [param: string]: string | string[]; };
        reportProgress?: boolean;
        responseType?: 'arraybuffer' | 'blob' | 'json' | 'text' | any;
        withCredentials?: boolean;
        customParameter?: boolean;
     }

I'm trying to unit test this custom implementation but I'm getting the following error in the expectOne

Error: Expected one matching request for criteria "Match by function: ", found 2 requests.

This is the unit test that I'm doing

    describe('CustomHttpClient', () => {

    const httpOptions: CustomHttpOptions = {
        CustomParameter: true
    };

    beforeEach(() => {
        TestBed.configureTestingModule({
            imports: [HttpClientTestingModule],
            providers: [CustomHttpClient]
        });
    });

    afterEach(inject([HttpTestingController], (httpMock: HttpTestingController) => {
        httpMock.verify();
    }));

    it('receive the optional parameter for a GET method', inject([CustomHttpClient, HttpTestingController], (http: CustomHttpClient, httpMock: HttpTestingController) => {

  
        http.get('/data', httpOptions).subscribe(
            response => {
                expect(response).toBeTruthy();
            }
        );

        const req = httpMock.expectOne((request: HttpRequest<any>) => {
            return request.method === 'GET';
        });

        expect(req.request.method).toEqual('GET');
        httpMock.verify();
      }));

    });

What am I missing?


Solution

  • Figured out the error, the subscribe method that I'm using on the custom request was causing a duplicate call, so this fixed the issue:

    super.request(first as string, url, options).pipe(share());