inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

실무에 바로 적용하는 프런트엔드 테스트 - 1부. 테스트 기초: 단위・통합 테스트

4.1. 통합 테스트란 무엇일까?

안녕하세요, 단위 테스트 대상 관련해서 질문있습니다.

188

TAEHEE JANG

작성한 질문수 2

0

web api인 IntersectionObserver을 활용한 훅이 있는데요,
훅은 독립적으로 동작되기 때문에 단위 테스트 대상이라고 말씀하셨는데,

궁금한점은

  1. web api를 활용한 훅은 단위테스트 대상일까요?
    테스트 환경이 다르고 web api는 이미 검증된 api이기 때문에 단위테스트 대상에서 제외 했거든요

  2. 만약 단위 테스트 대상이라면 web api를 모킹해서 훅을 통해 반환한 값들을 확인 하면될까요?

  3. 단위테스트 대상이 아니라면 통합테스트에서 해당 훅을 제대로 호출해서 사용하는지만 확인하면 될까요?

javascript react 소프트웨어-테스트 vitest

답변 1

1

코드 조커, 오프

안녕하세요! TAEHEE JANG님

코드를 보면 의견이 조금 달라질 수 있을 것 같지만, 우선 제공해주신 내용을 기준으로 답변 드리겠습니다.

개인적으로는 이미 구현이 되어있는 Web API는 테스트를 할 필요가 없습니다. 이런 테스트를 통해 기대하는 동작을 확인해 보기 어려울 수 있고, 의미 있는 테스트라고 보기는 어려울 것 같습니다. 이런 동작들은 저희 테스트 환경에서 JSDOM에 구현이 되어 있는데 실제 브라우저의 동작과 다른 부분이 있기 때문에 잘 동작한다 한들 실제 브라우저에서 잘 동작되는 것과는 의미가 다릅니다. (https://ui.toast.com/posts/ko_20220624)

그것과 별개로 해당 동작은 브라우저에서 관할하는 부분이며 문제가 발생하고 예상대로 동작하지 않는 부분을 가정하고 검증하는 것이 필요가 없을 것 같습니다. 마치 외부 라이브러리 처럼 문제가 발생해도 저희들이 관여할 수 없는 영역은 테스트의 영역에서 분리를 하는 것이 좋습니다.

다만, 말씀해주신것처럼 조건에 따라 Web API가 호출되는 것처럼 해당 코드를 호출된 이후의 동작은 정상적일것이라는 '가정하에' 해당 동작을 스파이로 검증한다면, 그정도는 충분히 검증할 수 있는 부분이라고 볼 수 있을 것 같습니다. (다만, 일부분에 대한 검증이기 때문에 여전히 아쉽기는 할 것 같습니다.)

추가로 저희는 테스트하는 환경에서 JSDOM을 활용하는데요. JSDOM에서 해당 동작을 지원하는지 확인해보면 좋을 것 같습니다. (https://github.com/jsdom/jsdom/issues/2032)

추가로 궁금한 점 있으시면 질문 주세요! 감사합니다.

mockZustand

0

67

2

프로젝트 세팅 오류 및 버전 오류 문제 문의

0

97

2

toggleIsModalOpened 테스트 할때 궁금한 점이 있습니다.

0

43

2

로딩/에러처리 검증은 어떻게 하는게 좋을까요?

0

65

1

통합 테스트에서 API 요청에 대한 검증은 이루어지지 않아도 괜찮을까요?

0

71

2

lint에러..

0

74

1

단언문 순서에 따라 테스트 결과가 왜 달라지나요?

0

109

2

useNavigate 테스트 시, 검증 대상 질문입니다.

0

113

2

강의 예시프로젝트 업데이트좀 부탁드립니다.

2

166

2

통합테스트와 단위테스트 파일 분리

0

109

1

grid 양옆에 margin은 어디서 설정되어있는건가요 ?

0

131

1

vitest 설치했는데

0

207

2

2부 할인쿠폰 관련

0

177

1

에러 해결 방법

0

407

2

직접 구현한 atom 컴포넌트 테스트 범위 질문

0

175

1

setup, teardown 동작 순서

0

212

1

debounce 함수 테스트 정확도 관련 질문입니다.

0

177

2

ProductFilter test 어떤 방식이 더 선호되는 방식일까요?

0

204

2

통합 테스트 작성 방식에 대해 궁금한 점이 있습니다

0

259

2

vitest Extension 알려주세요.

0

268

1

2.1 강의 질문있습니다.

0

140

1

useNavigate()을 검증할 때 이해가 안되는 부분이 있습니다.

0

248

2

toHaveStyle 메서드 사용이 조금 이상한 것 같습니다.

0

196

2

TestPayment에 쿠폰 정보를 prop으로 전달하는 이유

0

186

2