소비자 테스트 작성

이 튜토리얼은 처음부터 소비자 테스트를 작성하는 방법을 안내합니다. 먼저, 소비자 테스트는 pact-js를 기반으로 하는 jest-pact를 사용하여 작성됩니다. 이 튜토리얼에서는 MergeRequests#show 페이지에서 호출되는 /discussions.json REST API 엔드포인트에 대한 소비자 테스트를 어떻게 작성하는지 보여줍니다. 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는 pact-js에서 제공되는 것을 기반으로 하는 추가 옵션을 소개합니다. 대부분의 경우, 이러한 테스트에 대해 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에 대한 네 가지 속성을 정의합니다:

  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: '토론이 있는 병합 요청',
          uponReceiving: '토론 요청',
          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('성공적인 본문 반환', 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('성공적인 본문 반환', async () => {
        const discussions = await getDiscussions({
          url: provider.mockService.baseUrl,
        });

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