API contract testing with Pact and Angular

Question

I have this function:

saveApplication(details: Application): Observable<any> {
return this.http.post(`http://localhost:5000/Apply`, details);
}

And I am writing a Pact Test for it (API contract testing) and below is the test:

describe('ApplicationService contract testing', () => {

let provider: PactWeb;
let applicationService: ApplicationService;

beforeAll(function (done) {

    provider = new PactWeb({
        cors: true, host: '127.0.0.1', port: 9776, logLevel: 'error'
    });
    setTimeout(done, 2000);

    provider.removeInteractions();
});

afterAll(function (done) {
    provider.finalize().then(function () {
        done();
    }, function (err) { done.fail(err); });
});
beforeEach(() => {

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

    applicationService = getTestBed().get(ApplicationService);
});

afterEach((done) => {
    provider.verify().then(done, e => done.fail(e));
});
describe('Save', () => {

    const _details: Application = {
        title: 'Mr', firstName: 'Application', lastName: 'applicant',
        dob: new Date(1977, 10, 10).toString(), gender: 'M'
    };
    beforeAll((done) => {

        provider.addInteraction({
            state: ' a task to save the dashboard application to mongo',
            uponReceiving: ' a request to post',
            withRequest: {
                method: 'POST',
                headers: { 'Content-Type': 'application/json' },
                path: '/Apply', body: _details
            }, willRespondWith:
            {
                status: 201,
                headers: {
                    'Content-Type': 'application/json'
                }
            }
        }).then(done, e => done.fail(e));
        it('should call the API to Post the application Content', (done) => {

            const _response: any = {};
            applicationService.saveApplication(_details).subscribe(res => {
                expect(res).toEqual(_response);
                done();
            }, error => { done.fail(error); }
            );
        });
    });

});
});

The test isn't running when id npm run test or ng test, ut the pacts directory is being created. I don't know what is missing from my configs

This is what I have in Karma:

 frameworks: ['jasmine', '@angular-devkit/build-angular','pact'],
 plugins: [....,
  require('@pact-foundation/karma-pact')],
 pact: [{
  cors: true,
  port: 9776,
  consumer: "ui",
  provider: "Apply",
  dir: "pacts/",
  spec: 2
}],
proxies: {
  '/api/applications/v1/': 'http://localhost:9776/Apply/'
},

Not sure what I am missing. any help?

score 0 · Answer 1 · answered Aug 14 '20 at 00:47

If you're tests aren't running at all, but the pact folder is being generated, that implies:

The karma-pact plugin is firing and starting up
There is some issue that is preventing the tests from running at all

I'd start with removing all of the pact stuff from your test until you can have a green test (that doesn't do anything) and then add things back in one by one.

I can't quite see what's happening with the proxy, but it doesn't seem to align with what your code actually does (the proxy path is /api/applications/v1 which appears to send it to Pact on port 9776 but your code hits the path /Apply directly).

I'm not an angular expert, so just in case it's not clear, you need to make sure your saveApplication function calls the actual pact mock service in the test.

Side note: the use of done is quite old and in most cases you should be able to translate:

afterAll(function (done) {
    provider.finalize().then(function () {
        done();
    }, function (err) { done.fail(err); });
});

to:

afterAll(() => provider.finalize())

Thanks @Matthew, I will give that a go and let you know. That's very kind — Jack M, Aug 17 '20 at 07:24

API contract testing with Pact and Angular

1 Answers1