ngx-http-test

Makes testing Http calls in Angular 2 as easy as were in AngularJS.

Installation

1npm install ngx-http-test --save-dev

Usage

1// First add it as a provider
2beforeEach(() => {
3  TestBed.configureTestingModule({
4    providers: [
5      ...
6      FakeBackend.getProviders()
7    ]
8  });
9});
10
11// Get the instance of it
12beforeEach(inject([..., FakeBackend], (..., fakeBackend: FakeBackend) => {
13  backend = fakeBackend;
14}));
15
16// Use it in a test case
17it('should call fake endpoint', (done) => {
18  backend.expectGET('users/blacksonic').respond({ username: 'blacksonic' });
19  
20  subject.getProfile('blacksonic').subscribe((response) => {
21    expect(response).toEqual({ username: 'blacksonic' });
22    done();
23  });
24})

It is possible to specify every detail of the response.

1// can be object, it will be json stringified if not a string
2let responseBody = { username: 'blacksonic' };
3let responseStatus = 200;
4let responseHeaders = { 'Content-Type': 'application/json' };
5
6backend
7  .expectGET('users/blacksonic')
8  .respond(responseBody, responseStatus, responseHeaders);

It is not necessary to give the response, in that case the backend will respond with 200 empty response.

Also the expected url can be given as a regular expression instead of a string.

For requests outside of GET the request body can be also specified.

1backend.expectPost(
2  'usernamepassword/login', // url
3  { username: 'blacksonic', password: 'secret' }, // payload
4  { 'Content-Type': 'application/json' } // headers
5).respond(responseForm);

Convenience methods available for different kind of requests: expectGet, expectPost, expectDelete, expectPut, expectPatch, expectHead, expectOptions.

After the tests run it is possible to check for outstanding connections or expectations that are not addressed.

1afterEach(() => {
2  backend.verifyNoPendingRequests();
3  backend.verifyNoPendingExpectations();
4});

By default expectations get verified instantly, but this can be switched off and do the verification by hand.

1it('should call fake endpoint', (done) => {
2  backend.setAutoRespond(false);
3  backend.expectGET('users/blacksonic').respond({ username: 'blacksonic' });
4  
5  subject.getProfile('blacksonic').subscribe((response) => {
6    expect(response).toEqual({ username: 'blacksonic' });
7    done();
8  });
9  
10  backend.flush();
11})

The flush method resolves all pending connections. It can also be resolved one by one with the flushNext method.