Medium

7주차 과제 체크포인트

기본과제

Medium

• 총 11개의 파일, 115개의 단위 테스트를 무사히 작성하고 통과시킨다.

질문

Q. medium.useEventOperations.spec.tsx > 아래 toastFn과 mock과 이 fn은 무엇을 해줄까요?

Q. medium.integration.spec.tsx > 여기서 ChakraProvider로 묶어주는 동작은 의미있을까요? 있다면 어떤 의미일까요?

Q. handlersUtils > 아래 여러가지 use 함수는 어떤 역할을 할까요? 어떻게 사용될 수 있을까요?

Q. setupTests.ts > 왜 이 시간을 설정해주는 걸까요? 테스트 시점마다 날짜가 달라지면 작성된 테스트의 결과가 달라질 수 있기 때문에 날짜를 고정하기 위해 사용합니다.

심화 과제

• App 컴포넌트 적절한 단위의 컴포넌트, 훅, 유틸 함수로 분리했는가?
• 해당 모듈들에 대한 적절한 테스트를 5개 이상 작성했는가?

과제 셀프회고

기술적 성장

• 테스트 코드 자체를 처음 작성해봅니다.
• 이전 과제들에서 테스트 코도의 중요성은 절실히 느꼈지만, 직접 짜보는 건 아예 새로운 경험이었습니다. 테스트 코드도 비즈니스 로직 짜듯 정성을 기울여야하는구나 느꼈습니다

코드 품질

학습 효과 분석

easy.useSearch.spec - new Date() 시스템 시간 값이 이상한데?

처음에는 dummy events 데이터를 8월로 만들고서 계속 테스트 통과 안되어서 원인을 찾다가 설마하고 new Date() 콘솔에 찍어보니까 10월이라고 떠서 당황했습니다. new Date() 가 10월이라니. 지금 8월인데 10월로 나오는게 이상해서 한참 생각했습니다. 시스템 환경 내 시간이 잘 못 됐을리는 없고 관련된 부분이 어디있었을까 한참 찾았습니다.

beforeEach(() => {
    expect.hasAssertions(); // ? Med: 이걸 왜 써야하는지 물어보자

    vi.setSystemTime(new Date('2025-10-01')); // ? Med: 이걸 왜 써야하는지 물어보자
});

이걸 왜 써야하는지 진작 물어볼걸...

easy.dateUtils.spec - getDaysInMonth

//  day에 0을 넣음으로써 monthIndex에 넣은 정수의 -1월을 계산한다.
function getDaysInMonth(year: number, month: number): number {
     return new Date(year, month, 0).getDate();
}

new Date(2025, 8, 0) -> 여기서 8은 9월, day가 0으로 9월에서 -1을 한 8월로 계산됨. month param에 8을 넣고 결과값도 8월로 계산됨.

monthIndex는 0에서 11로 월을 판단하는데, 우리가 쓰는 1~12월과는 -1씩 차이나기 때문에 moth parameter가 우리가 실사용하는 월로 계산되는 경우. 함수 제대로 안 보고 막 작성했다가 꽤나 꼬였습니다. 기존 코드를 잘 살펴보자..

과제 피드백

• 테스트 코드 반복 작성으로 초급자에게 금방 익숙해지는.. 이제 간단한 테스트는 짤 수 있을 것 같아요...

리뷰 받고 싶은 내용