소비자 테스트 작성

이 튜토리얼은 소비자 테스트를 처음부터 작성하는 방법을 안내합니다. 먼저, 소비자 테스트는 jest-pact을 사용하여 작성되는데, 이는 pact-js를 기반으로 합니다. 이 튜토리얼은 /discussions.json REST API 엔드포인트에 대한 소비자 테스트를 작성하는 방법을 보여줍니다. 이 엔드포인트는 /:namespace_name/:project_name/-/merge_requests/:id/discussions.json 에서 MergeRequests#show 페이지에서 호출됩니다. GraphQL 소비자 테스트의 예시는 spec/contracts/consumer/specs/project/pipelines/show.spec.js를 참조하십시오.

뼈대 생성

먼저, 소비자 테스트의 뼈대를 생성합니다. 이는 MergeRequests#show 페이지에서의 요청을 위한 것이므로, spec/contracts/consumer/specs/project/merge_requests 디렉터리 아래에 show.spec.js이라는 파일을 생성하십시오. 그런 다음, 다음 기능과 매개변수로 채웁니다:

계약 테스트 디렉터리 구조에 대한 자세한 내용은 테스트 스위트 폴더 구조를 참조하십시오.

pactWith 함수

pactWith 함수를 통해 Pact 소비자 테스트가 정의됩니다. 이 함수는 PactOptions와 PactFn을 사용합니다. 

import { pactWith } from 'jest-pact';

pactWith(PactOptions, PactFn);

PactOptions 매개변수

jest-pact의 PactOptions은 추가 옵션을 소개하는데, 이는 주로 이러한 테스트에서 제공되는 옵션에 기반한 것입니다. 대부분의 경우, 이 테스트에 대해 consumer, provider, log, dir 옵션을 정의합니다. 

import { pactWith } from 'jest-pact';

pactWith(
  {
    consumer: 'MergeRequests#show',
    provider: 'GET discussions',
    log: '../logs/consumer.log',
    dir: '../contracts/project/merge_requests/show',
  },
  PactFn
);

소비자와 공급자의 명칭에 대한 자세한 정보는 명명 규칙을 참조하십시오.

PactFn 매개변수

PactFn은 테스트가 정의되는 곳입니다. 여기서는 목 프로바이더를 설정하고 Jest.describe, Jest.beforeEach, Jest.it와 같은 표준적인 Jest 메서드를 사용할 수 있습니다. 자세한 내용은 https://jestjs.io/docs/api를 참조하십시오. 

import { pactWith } from 'jest-pact';

pactWith(
  {
    consumer: 'MergeRequests#show',
    provider: 'GET discussions',
    log: '../logs/consumer.log',
    dir: '../contracts/project/merge_requests/show',
  },

  (provider) => {
    describe('GET discussions', () => {
      beforeEach(() => {

      });

      it('return a successful body', async () => {

      });
    });
  },
);

목 프로바이더 설정

테스트를 실행하기 전에 지정된 요청을 처리하고 지정된 응답을 반환하는 목 프로바이더를 설정하십시오. 이를 위해 Interaction에서 상태 및 기대 요청 및 응답을 정의합니다.

이 튜토리얼에서 Interaction에 대해 4개의 속성을 정의하십시오:

  1. state: 요청을 하기 전에 사전 조건의 설명.
  2. uponReceiving: 이 Interaction이 처리하는 요청의 설명.
  3. withRequest: 요청 사양을 정의하는 곳. 요청 method, path, 및 headers, body, 또는 query가 포함됩니다.
  4. willRespondWith: 예상 응답을 정의하는 곳. 응답 status, headers, 및 body가 포함됩니다.

Interaction을 정의한 후, addInteraction를 호출하여 해당 상호 작용을 목 프로바이더에 추가하십시오. 

import { pactWith } from 'jest-pact';
import { Matchers } from '@pact-foundation/pact';

pactWith(
  {
    consumer: 'MergeRequests#show',
    provider: 'GET discussions',
    log: '../logs/consumer.log',
    dir: '../contracts/project/merge_requests/show',
  },

  (provider) => {
    describe('GET discussions', () => {
      beforeEach(() => {
        const interaction = {
          state: 'a merge request with discussions exists',
          uponReceiving: 'a request for discussions',
          withRequest: {
            method: 'GET',
            path: '/gitlab-org/gitlab-qa/-/merge_requests/1/discussions.json',
            headers: {
              Accept: '*/*',
            },
          },
          willRespondWith: {
            status: 200,
            headers: {
              'Content-Type': 'application/json; charset=utf-8',
            },
            body: Matchers.eachLike({
              id: Matchers.string('fd73763cbcbf7b29eb8765d969a38f7d735e222a'),
              project_id: Matchers.integer(6954442),
              ...
              resolved: Matchers.boolean(true)
            }),
          },
        };
        provider.addInteraction(interaction);
      });

      it('return a successful body', async () => {

      });
    });
  },
);

응답 본문 Matchers

예상 응답의 본문에서 Matchers를 사용하는 방법에 주목하십시오. 이를 통해 다양한 값들을 유연하게 처리하면서도 유효하고 잘못된 값들을 구별할 수 있습니다. 너무 엄격하지 않으면서도 너무 느슨하지 않은 정의를 보장해야 합니다. 다양한 종류의 Matchers에 대해 더 읽어보십시오. 현재 V2 일치 규칙을 사용하고 있습니다.

테스트 작성

가짜 공급자를 설정한 후 테스트를 작성할 수 있습니다. 이 테스트에서는 요청을 만들고 특정 응답을 기대합니다.

먼저 API 요청을 하는 클라이언트를 설정합니다. 이를 위해 spec/contracts/consumer/resources/api/project/merge_requests.js를 생성하고 다음 API 요청을 추가합니다. 엔드포인트가 GraphQL인 경우, 대신 spec/contracts/consumer/resources/graphql 아래에 생성합니다. 

import axios from 'axios';

export async function getDiscussions(endpoint) {
  const { url } = endpoint;

  return axios({
    method: 'GET',
    baseURL: url,
    url: '/gitlab-org/gitlab-qa/-/merge_requests/1/discussions.json',
    headers: { Accept: '*/*' },
  })
}

그 후, 해당 내용을 테스트 파일로 가져와 요청을 보냅니다. 그런 다음 요청을 수행하고 기대하는 내용을 정의할 수 있습니다. 

import { pactWith } from 'jest-pact';
import { Matchers } from '@pact-foundation/pact';

import { getDiscussions } from '../../../resources/api/project/merge_requests';

pactWith(
  {
    consumer: 'MergeRequests#show',
    provider: 'GET discussions',
    log: '../logs/consumer.log',
    dir: '../contracts/project/merge_requests/show',
  },

  (provider) => {
    describe('GET discussions', () => {
      beforeEach(() => {
        const interaction = {
          state: 'a merge request with discussions exists',
          uponReceiving: 'a request for discussions',
          withRequest: {
            method: 'GET',
            path: '/gitlab-org/gitlab-qa/-/merge_requests/1/discussions.json',
            headers: {
              Accept: '*/*',
            },
          },
          willRespondWith: {
            status: 200,
            headers: {
              'Content-Type': 'application/json; charset=utf-8',
            },
            body: Matchers.eachLike({
              id: Matchers.string('fd73763cbcbf7b29eb8765d969a38f7d735e222a'),
              project_id: Matchers.integer(6954442),
              ...
              resolved: Matchers.boolean(true)
            }),
          },
        };
      });

      it('return a successful body', async () => {
        const discussions = await getDiscussions({
          url: provider.mockService.baseUrl,
        });

        expect(discussions).toEqual(Matchers.eachLike({
          id: 'fd73763cbcbf7b29eb8765d969a38f7d735e222a',
          project_id: 6954442,
          ...
          resolved: true
        }));
      });
    });
  },
);

여기까지입니다! 이제 소비자 테스트가 설정되었습니다. 이제 이 테스트를 실행해볼 수 있습니다.

테스트 가독성 향상

알아차리겠지만, 요청 및 응답 정의가 매우 커질 수 있습니다. 이로 인해 테스트가 원하는 내용을 찾기 어려운 현상이 발생할 수 있습니다. 이러한 부분을 fixture로 추출하여 테스트를 더 쉽게 읽을 수 있도록 개선할 수 있습니다.

spec/contracts/consumer/fixtures/project/merge_requests 아래에 discussions.fixture.js라는 파일을 만들어 request 및 response 정의를 넣습니다. 

import { Matchers } from '@pact-foundation/pact';

const body = Matchers.eachLike({
  id: Matchers.string('fd73763cbcbf7b29eb8765d969a38f7d735e222a'),
  project_id: Matchers.integer(6954442),
  ...
  resolved: Matchers.boolean(true)
});

const Discussions = {
  body: Matchers.extractPayload(body),

  success: {
    status: 200,
    headers: {
      'Content-Type': 'application/json; charset=utf-8',
    },
    body,
  },

  scenario: {
    state: 'a merge request with discussions exists',
    uponReceiving: 'a request for discussions',
  },

  request: {
    withRequest: {
      method: 'GET',
      path: '/gitlab-org/gitlab-qa/-/merge_requests/1/discussions.json',
      headers: {
        Accept: '*/*',
      },
    },
  },
};

exports.Discussions = Discussions;

모든 내용이 fixture로 이동되었으므로 아래와 같이 테스트를 단순화할 수 있습니다. 

import { pactWith } from 'jest-pact';

import { Discussions } from '../../../fixtures/project/merge_requests/discussions.fixture';
import { getDiscussions } from '../../../resources/api/project/merge_requests';

const CONSUMER_NAME = 'MergeRequests#show';
const PROVIDER_NAME = 'GET discussions';
const CONSUMER_LOG = '../logs/consumer.log';
const CONTRACT_DIR = '../contracts/project/merge_requests/show';

pactWith(
  {
    consumer: CONSUMER_NAME,
    provider: PROVIDER_NAME,
    log: CONSUMER_LOG,
    dir: CONTRACT_DIR,
  },

  (provider) => {
    describe(PROVIDER_NAME, () => {
      beforeEach(() => {
        const interaction = {
          ...Discussions.scenario,
          ...Discussions.request,
          willRespondWith: Discussions.success,
        };
        provider.addInteraction(interaction);
      });

      it('return a successful body', async () => {
        const discussions = await getDiscussions({
          url: provider.mockService.baseUrl,
        });

        expect(discussions).toEqual(Discussions.body);
      });
    });
  },
);