테스트 전략

공통

• feature 에는 테스트가 꼭 포함된다.
• 함수 단위 테스트를 작성하며 한 함수에 대해 여러 테스트가 작성될 수 있다.
• describe : Suit, 테스트 대상이 되는 파일/모듈/컴포넌트 단위로 한다.
• it : Test, Suit에 작성된 함수/이벤트/테스크 단위로 한다.
• jest, cypress 사용 시 regex를 적극 활용해서 시간을 절약하자 (파일 이름 또는 테스트 이름을 정규표현식으로 이용, ex. npm run test "regex string")
• give, when, then 패턴을 작성한다.

// frontend - component example
describe("App", () => {
  it("Welcome가 상단에 노출된다", () => {
    const { queryByText } = render(<App />);
    expect(queryByText("welcome")).toBeInTheDocument();
  });

  it("button을 click하면 새로운 데이터가 노출된다", () => {
    const { getByText } = render(<App />);
    fireEvent.click(getByText("loading data"));
    const newContent = getByText("newdata");
  });
});

// backend - model example
describe("Model - User", () => {
  it("모든 사용자를 조회한다.", async () => {
     // given : 데이터는 Test DB에 이미 등록되어 있음
     const exclude = ["id", "password", "created_at", "updated_at"];

     // when
     const responseData = await user.findAll({
        attributes: { exclude }
     });

     // then
     expect(responseData.length).toBeTruthy();
  });
);

Frontend

Flow

1. (Jest, Enzyme) 컴포넌트 단위/통합 테스트
2. Storybook
   1. 개발 중인 컴포넌트에 대한 시각적 결과를 즉각적인 확인 (개발자가 직접 결과를 확인하는 테스트)
   2. Cypress를 이용하여 Storybook에서 각 컴포넌트에 대한 E2E 테스트
3. (Cypress) 프론트에 국한되어 백엔드 API를 Mocking하여 E2E 테스트
4. (Cypress) 실제 리액트 프로젝트에서 E2E 테스트

Step (About branch)

• feature => client-dev (1, 2-i)
• client-dev => client-master (2-ii, 3)

Convention

• 단위 테스트
  • 기본적으로 State 변경을 테스트한다.

---

Backend

Flow

1. (Jest, Supertest) API 단위/통합 테스트
2. (Ngrinder, Artillery) Stress 테스트

Step (About branch)

• feature => server-dev (1)
• server-dev => server-master (1)
• master (2)