import { HttpClient, HttpErrorResponse, HttpHeaders } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { Observable, of } from 'rxjs';
import { catchError, tap } from 'rxjs/operators';

@Injectable({
  providedIn: 'root'
})
export class RequestService {
  private getUserURL = 'https://jsonplaceholder.typicode.com/users';
  private postUserURL = 'https://jsonplaceholder.typicode.com/posts';

  constructor(private http: HttpClient) { } 

  getUserHttpRequest() {
    return this.http.get(this.getUserURL);
  }

  postUserHttpRequest(payload) {
    const header = new HttpHeaders();
    header.set('Content-type', 'application/json; charset=UTF-8');
    return this.http.post(this.postUserURL, payload, { headers: header })
      .pipe(
        tap(response => this.formatResponse(response)), 
          catchError(this.handleError())
        )
  }

  // Can use tap operator if U have to transform response in other format else can remove above tap operator
  private formatResponse(response) {
    const obj = {
      status: 200,
      statusText: 'OK',
      response: response.id
    }
    return response['response'] = obj;
  }

  private handleError() {
    return (error: HttpErrorResponse): Observable<any> => {
      return of(error);
    };
  }
}

import { HttpClientTestingModule, HttpTestingController } from '@angular/common/http/testing';
import { async, TestBed } from '@angular/core/testing';

import { RequestService } from './request.service';

describe('RequestService', () => {
  let service: RequestService;
  let httpTestingController: HttpTestingController;
  beforeEach(async(() => TestBed.configureTestingModule({
    imports: [HttpClientTestingModule]
  })));

  beforeEach(() => {
    service = TestBed.get(RequestService);
    httpTestingController = TestBed.get(HttpTestingController);
     /**
     * If you are using Angular Latest Version 9 then instead of TestBed.get we have to use TestBed.inject
     * 
     *  service = TestBed.inject(RequestService);
        httpTestingController = TestBed.inject(HttpTestingController);
     */
  });

  // Instead of check verify in each spec we can simply write in afterEach function.
  afterEach(() => {
    httpTestingController.verify();
  });


  it('should be created', () => {
    const service: RequestService = TestBed.get(RequestService);
    expect(service).toBeTruthy();
  });

  it('Test Get HTTP Request with HttpTesting Controller', () => {
    const mockUserList = [
      {
        "id": 1,
        "name": "Leanne Graham",
        "username": "Bret",
        "email": "Sincere@april.biz",
      }
    ];

    service.getUserHttpRequest().subscribe((resp: any) => {
      console.log("mock resp of get request", resp);
      expect(resp.length).toBeGreaterThanOrEqual(1);
      expect(resp).toEqual(mockUserList);
    });

    const request = httpTestingController.expectOne((service as any).getUserURL);
    expect(request.request.method).toBe("GET");
    expect(request.cancelled).toBeFalsy();
    expect(request.request.responseType).toEqual('json');


    /**
     * Using .flush()
      The request captured by the httpTestingController, req, 
      has a flush method on it which takes in whatever response you would like to provide for that request as an argument.
     */
    request.flush(mockUserList);

    /**
     * Verify All Requests are Complete
      Once all req have been provided a response using flush, we can verify that there are no more pending requests after the test.
      We have done this in afterEach function.

      > httpTestingController.verify();
     */

  });

  it('Test Post HTTP Request  with HttpTesting Controller', () => {
    const payload = JSON.stringify({
      title: 'foo',
      body: 'bar',
      userId: 1
    });

    const mockResult = {
      id: 101
    };
    service.postUserHttpRequest(payload).subscribe(resp => {
      //console.log("mock resp of post request", resp);
      expect(resp).toEqual(mockResult);
    });

    const request = httpTestingController.expectOne((service as any).postUserURL);
    expect(request.request.method).toBe("POST");
    expect(request.request.body).toEqual(payload);
    expect(request.request.url).toMatch((service as any).postUserURL);

    /**
     * flush(body, opts): void 
     * The flush is used to resolve the request by returning a body. For example,
     * Where body is string, number, object etc. and opts is optional
     */

    request.flush(mockResult);

  });

  it('Test Post HTTP Request  with HttpTesting Controller with 500 ERROR', () => {
    service.postUserHttpRequest({}).subscribe(resp => {
      console.log("post request mock error", resp);
      expect(resp.status).toEqual(500);
    });
    const request = httpTestingController.expectOne((service as any).postUserURL);
    const msg = '500';
    request.flush(msg, { status: 500, statusText: 'Server error' });

  });
});