Angular 2 mock Http get() to return local json file

You need to override the XhrBackend provider with the MockBackend one. You need then to create another injector to be able to execute a true HTTP request.

Here is a sample:

beforeEachProviders(() => {
  return [
    HTTP_PROVIDERS,
    provide(XHRBackend, { useClass: MockBackend }),
    SomeHttpService
  ];
});

it('Should something', inject([XHRBackend, SomeHttpService], (mockBackend, httpService) => {
  mockBackend.connections.subscribe(
    (connection: MockConnection) => {
      var injector = ReflectiveInjector.resolveAndCreate([
        HTTP_PROVIDERS
      ]);
      var http = injector.get(Http);
      http.get('data.json').map(res => res.json()).subscribe(data) => {
        connection.mockRespond(new Response(
          new ResponseOptions({
            body: data
          })));
      });
    });
}));

By the way, you need to mock the XHRBackend and provide mocked data in a class with the createDb method. createDb method returns the mocked JSON object. To load that data provide correct URL to http.get, for example, if JSON object is contained in a variable mockedObject, then the URL should be "app\mockedObject".

You can read more details here: https://angular.io/docs/ts/latest/guide/server-communication.html.

You can use the HttpTestingController available via the core TestBed as to me it feels more intuitive (each to their own, of course). Untested snippet:

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

import { MyApiService } from './my-api.service';

export function main() {
  describe('Test set', () => {
    let httpMock: HttpTestingController;

    beforeEach(() => {

      TestBed.configureTestingModule({
        imports: [],
        providers: [MyApiService]
      });

      httpMock = TestBed.get(HttpTestingController);
    });

    it('should call get', async(() => {

      const data: any = {mydata: 'test'};
      let actualResponse: any = null;
      MyApiService.get().subscribe((response: any) => {
        actualResponse = response;
      });

      httpMock.expectOne('localhost:5555/my-path').flush(data);
      expect(actualResponse).toEqual(data);

    }));
  });
}