title: Angular 6 service failing to pass unit tests with (NullInjectorError: No provider for HttpClient!)
body: <p>I am trying to do unit testing in angular 6 , when I run `ng test' </p>
  
  <p>I get the following error</p>
  
  <pre><code>Error: StaticInjectorError(DynamicTestModule)[HttpClient]:
            StaticInjectorError(Platform: core)[HttpClient]:
              NullInjectorError: No provider for HttpClient!
              at NullInjector.push../node_modules/@angular/core/fesm5/core.js.NullInjector.get (http://localhost:9876/node_modules/@angular/core/fesm5/core.js?:691:1)
              at resolveToken (http://localhost:9876/node_modules/@angular/core/fesm5/core.js?:928:1)
              at tryResolveToken (http://localhost:9876/node_modules/@angular/core/fesm5/core.js?:872:1)
              at StaticInjector.push../node_modules/@angular/core/fesm5/core.js.StaticInjector.get (http://localhost:9876/node_modules/@angular/core/fesm5/core.js?:769:1)
              at resolveToken (http://localhost:9876/node_modules/@angular/core/fesm5/core.js?:928:1)
              at tryResolveToken (http://localhost:9876/node_modules/@angular/core/fesm5/core.js?:872:1)
              at StaticInjector.push../node_modules/@angular/core/fesm5/core.js.StaticInjector.get (http://localhost:9876/node_modules/@angular/core/fesm5/core.js?:769:1)
              at resolveNgModuleDep (http://localhost:9876/node_modules/@angular/core/fesm5/core.js?:17435:1)
              at NgModuleRef_.push../node_modules/@angular/core/fesm5/core.js.NgModuleRef_.get (http://localhost:9876/node_modules/@angular/core/fesm5/core.js?:18124:1)
              at inject (http://localhost:9876/node_modules/@angular/core/fesm5/core.js?:1023:1)
  Chrome 69.0.3497 (Windows 10 0.0.0): Executed 2 of 12 (2 FAILED) (0 secs / 0.119 secs)
  Chrome 69.0.3497 (Windows 10 0.0.0) UserService should have add function FAILED
          Error: StaticInjectorError(DynamicTestModule)[HttpClient]:
            StaticInjectorError(Platform: core)[HttpClient]:
              NullInjectorError: No provider for HttpClient!
              at NullInjector.push../node_modules/@angular/core/fesm5/core.js.NullInjector.get (http://localhost:9876/node_modules/@angular/core/fesm5/core.js?:691:1)
              at resolveToken (http://localhost:9876/node_modules/@angular/core/fesm5/core.js?:928:1)
              at tryResolveToken (http://localhost:9876/node_modules/@angular/core/fesm5/core.js?:872:1)
              at StaticInjector.push../node_modules/@angular/core/fesm5/core.js.StaticInjector.get (http://localhost:9876/node_modules/@angular/core/fesm5/core.js?:769:1)
              at resolveToken (http://localhost:9876/node_modules/@angular/core/fesm5/core.js?:928:1)
              at tryResolveToken (http://localhost:9876/node_modules/@angular/core/fesm5/core.js?:872:1)
              at StaticInjector.push../node_modules/@angular/core/fesm5/core.js.StaticInjector.get (http://localhost:9876/node_modules/@angular/core/fesm5/core.js?:769:1)
              at resolveNgModuleDep (http://localhost:9876/node_modules/@angular/core/fesm5/core.js?:17435:1)
              at NgModuleRef_.push../node_modules/@angular/core/fesm5/core.js.NgModuleRef_.get (http://localhost:9876/node_modules/@angular/core/fesm5/core.js?:18124:1)
  Chrome 69.0.3497 (Windows 10 0.0.0): Executed 2 of 12 (2 FAILED) (skipped 10) ERROR (0.094 secs / 0.119 secs)
  </code></pre>
  
  <p>Here is service spec ts file</p>
  
  <pre><code> import { TestBed } from '@angular/core/testing';
  import { HttpClientTestingModule, HttpTestingController } from '@angular/common/http/testing';
  import {HttpClientModule} from '@angular/common/http';
  import { UserService } from './user.service';
  
  TestBed.configureTestingModule({
      imports: [HttpClientTestingModule, HttpClientModule],
      providers: [UserService]
  });
  
  fdescribe('UserService', () =&gt; {
    beforeEach(() =&gt; TestBed.configureTestingModule({}));
  
    it('should be created', () =&gt; {
      const service: UserService = TestBed.get(UserService);
      expect(service).toBeTruthy();
    });
  
    it('should have add function', () =&gt; {
      const service: UserService = TestBed.get(UserService);
      expect(service.addComments).toBeTruthy();
    });
  
  });
  </code></pre>
  
  <p>Her is usersevice ts file </p>
  
  <pre><code>import { Injectable } from '@angular/core';
  import { HttpClient } from '@angular/common/http';
  import {Status } from '../model/statuses.model';
  import { Comment } from '../model/comments.model';
  import { User } from '../model/user.model';
  import { Headers, Http, Response } from '@angular/http';
  import { catchError, tap, map } from 'rxjs/operators';
  import { Observable, of, throwError } from 'rxjs';
  import { HttpHeaders, HttpErrorResponse } from '@angular/common/http';
  
  const httpOptions = {
    headers: new HttpHeaders({ 'Content-Type': 'application/json' })
  };
  
  @Injectable({
    providedIn: 'root'
  })
  export class UserService {
    status: Status[];
    constructor(private http: HttpClient) { }
    statusUrl = 'http://localhost:3000/statuses';
    commentsUrl = 'http://localhost:3000/comment';
    usersUrl = 'http://localhost:3000/users';
  
    private extractData(res: Response) {
      // tslint:disable-next-line:prefer-const
      let body = res;
      return body || {};
    }
  
   // get all users
    getUsers(): Observable&lt;any&gt; {
      return this.http.get(this.usersUrl).pipe(
        map(this.extractData),
        catchError(this.handleError));
      }
  
    // get users by ID
    getUserById(id: number) {
      return this.http.get&lt;User&gt;(this.usersUrl + '/' + id);
    }
  
    // get all statuses
    getStatuses(): Observable&lt;any&gt; {
      return this.http.get(this.statusUrl).pipe(
        map(this.extractData),
        catchError(this.handleError));
      }
  
    // add comments
    addComments(comments: Comment) {
      comments.localTime = new Date();
      return this.http.post(this.commentsUrl, comments);
    }
  
    // get comments
    getComments(id: number): Observable&lt;any&gt; {
      return this.http.get(this.commentsUrl).pipe(
        map(this.extractData),
        catchError(this.handleError));
    }
    // upadet user status
    updateStatus(status: Status) {
    return this.http.put(this.statusUrl + '/' + status.id, status);
    }
  
    // add user status
    addStatus(status: Status) {
      return this.http.put(this.statusUrl, status);
     }
     // Errors Handler
    private handleError(error: HttpErrorResponse) {
      if (error.error instanceof ErrorEvent) {
        // A client-side or network error occurred. Handle it accordingly.
        console.error('An error occurred:', error.error.message);
      } else {
        // The backend returned an unsuccessful response code.
        // The response body may contain clues as to what went wrong,
        console.error(
          `Backend returned code ${error.status}, ` +
          `body was: ${error.error}`);
      }
      // return an observable with a user-facing error message
      return throwError('Something bad happened; please try again later.');
    }
  
  }
  </code></pre>
  
  <p>I tried different solution from stack oveflow but nothing is working , I tried even this solution here <a href="https://stackoverflow.com/questions/48572621/angular-5-service-failing-to-pass-unit-tests-with-nullinjectorerror-no-provide?rq=1">unit test errors angular 5</a></p>
  
  <p>But unfortunatelly nothing works in angular 6 </p>
  
  <p>What am I doing wrong, any help will be apreciated????</p>