Unit 테스트

테스트 코드

드디어 시작된 프론트 엔트 테스트 코드 작성 과제입니다.
함수가 대충 어떤 역할을 해주는 지만 알지, 이걸 실제 로직을 고려한 테스트 코드로는 작성해본 적이 없기에, 이전 1, 2챕터보다 더 어렵게 느껴지는 것 같습니다.

Unit 테스트

주어진 함수 자체에 대한 테스트로, 주어진 조건 하에서 입력값에 따른 결과값이 적절한 지에 대한 테스트 입니다.

it('윤년의 2월에 대해 29일을 반환한다', () => {
  expect(getDaysInMonth(2024, 2)).toBe(29); // 윤년
});

it('유효하지 않은 월에 대해 적절히 처리한다', () => {
  // type number인 값
  expect(getDaysInMonth(2025, NaN)).toBeNaN();
  expect(getDaysInMonth(2025, Infinity)).toBeNaN();
  expect(getDaysInMonth(2025, -Infinity)).toBeNaN();
  expect(getDaysInMonth(2025, Number.MAX_VALUE)).toBeNaN();
  expect(getDaysInMonth(2025, Number.MIN_VALUE)).toBe(31);
  console.log(getDaysInMonth(2025, Number.MIN_VALUE));

  // 범위 초과
  expect(getDaysInMonth(2025, -1)).toBe(30); // 11월
  expect(getDaysInMonth(2025, 0)).toBe(31); // 12월
  expect(getDaysInMonth(2025, 13)).toBe(31); // 1월
});

이처럼 예측값이 정확하게 반환되는 지 toBe 또는 toEqual 과 같은 비교 함수로 예측을 하는 테스트입니다.

• 경계값이 잘 제어 되는 지에 대한 사항을 중점적으로 확인했습니다.
• 다만, 실제 사용자화면을 고려하면 입력이 불가능한 값까지 범주를 너무 크게 잡으면, 테스트를 관리하는 소요가 커지게 됩니다.

Hooks 테스트

리액트에서 사용자의 액션이나 페이지의 상태변화에 대응하여 값이 변하는 것을 측정하기 위해 훅 단위의 테스트를 진행합니다.
가상으로 훅을 랜더링하여, 반환되는 값을 바탕으로 화면 이었다면, 어떤 값을 보였을 것이다 하는 로직의 결과물을 테스트 했습니다.

it('holidays는 10월 휴일인 개천절, 한글날이 지정되어 있어야 한다', () => {
  // const fake = new Date('2025-10-01');
  // vi.useFakeTimers();
  // vi.setSystemTime(fake);

  const { result } = renderHook(() => useCalendarView());
  expect(result.current.holidays).toEqual({
    '2025-10-03': '개천절',
    '2025-10-05': '추석',
    '2025-10-06': '추석',
    '2025-10-07': '추석',
    '2025-10-09': '한글날',
  });
  // vi.useRealTimers();
});

이처럼 가상 훅을 통한 결과값을 비교하게 됩니다.

• 주의 할 점은 시간과 관련된 훅의 경우에는 가상의 현재 시간을 세팅하고, 초기화하는 과정을 필요로 합니다.
• 그리고, 훅이 동작하면서 비동기적으로 처리가 되는 함수들 또한 대기 상태를 고려하여 테스트 되어야 합니다.

TODO

이번 과정은 easy, medium, hard 단계를 구분하여 진행이 되고 있습니다. hard로 호기롭게 시작하였으나, 익숙치 않음으로 인해 테스트 코드 구현에 진척이 더딘편입니다. 아마 채점할 때 medium으로 해달라고 하지 않을까 합니다. 2일 1글쓰기할 시간조차 부족한 것 같습니다.
일단 최선을 다해 테스트 코드를 작성하겠습니다.