CODEWITHSUNDEEP
angular
valik
valik

Reputation: 2094

StaticInjectorError during ng test

I am getting this error when i run ng test my app module seems ok I have all imports in my module and in servive test i have providers [service ] i dont know why all the tests are failing below is one of the failing test any one please suggestions thank you 

   Error: StaticInjectorError(DynamicTestModule)[OrderService -> HttpClient]: 
              StaticInjectorError(Platform: core)[OrderService -> HttpClient]: 
                NullInjectorError: No provider for HttpClient!
                at _NullInjector.webpackJsonp../node_modules/@angular 
            Error: StaticInjectorError(DynamicTestModule)[OrderService -> HttpClient]: 
          StaticInjectorError(Platform: core)[OrderService -> HttpClient]: 
            NullInjectorError: No provider for HttpClient!

This is service class

import  { Injectable } from '@angular/core';
 import {HttpClient, HttpErrorResponse, HttpHeaders, HttpResponse} from "@angular/common/http"; 

@Injectable()
export class OrderService {

  baseUrl : string = 'http://localhost:8088/orders';

  filterUrl: string = 'http://localhost:8088/orders?start=?&end=?';

  private order: Order;
  private headers = new HttpHeaders({'Content-Type': 'application/json'});


  constructor(private http: HttpClient) { }

  getOrders(From: Date, To: Date): Observable<Order[]> {
    return this.http.get(this.baseUrl + '?start=' + From + '&end=' + To)
      .pipe(map(this.extractData),
        tap(data => console.log(JSON.stringify(data))),
        catchError(this.handleError)
      );
  }

  createOrder(order: Order): Observable<number> {
    return this.http.post(this.baseUrl, JSON.stringify(order), {headers: this.headers})
      .pipe(map(this.extractData),
        catchError(this.handleError));
  }

I app module.ts i have

imports: [
    NgbModule.forRoot(),
    BrowserModule,
    AppRoutingModule,
    FormsModule,
    HttpClientModule,
    ReactiveFormsModule

  ],
      providers: [OrderService,TruckService],
export class AppModule {
   constructor(router: Router) {
     console.log('Routes: ', JSON.stringify(router.config, undefined, 2));
    }
 }

This is the test 

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

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


  it(`should create`, async(inject([TruckService, HttpTestingController],
    (service: TruckService, httpClient: HttpTestingController) => {
      expect(service).toBeTruthy();
    })));

Upvotes: 2

Views: 825

Answers (1)

R. Richards
R. Richards

Reputation: 25151

In order to test services that use the HttpClient, you are going to have to include the testing module and controller that come from Angular for this.

This includes HttpClientTestingModule for backend configuration, and HttpTestingController for mocking and flushing of requests.

Here is something that could work for you:

import { TestBed, async, inject } from '@angular/core/testing';
import { HttpClientTestingModule, HttpTestingController } from '@angular/common/http/testing';
import { TruckService } from './truck.service';

describe('TruckService', () => {

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

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

it(`should create`, async(inject([TruckService, HttpTestingController],
    (service: TruckService, httpClient: HttpTestingController) => {
    expect(service).toBeTruthy();
})));
});

For details on testing HTTP requests in the Angular HttpClient, go here. Here are API details on HttpClientTestingModule, and HttpTestingController.

Upvotes: 2

Related Questions