[인프런] 실무에 바로 적용하는 프런트엔드 테스트 1부 - 올바른 테스트 작성 규칙

기술 노트
2026. 2. 17. 08:08
2026. 2. 19. 13:38

인터페이스를 기준으로 테스트를 작성하기

이곳에서 인터페이스란 서로 다른 클래스 또는 모듈이 상호작용하는 시스템을 의미한다. 모든 테스트는 세부 구현을 테스트하는 것 대신 외부에 노출되는 인터페이스를 기준으로 작성되어야 한다.

내부 구현에 대한 테스트는 캡슐화를 위반하는 깨지기 쉬운 테스트이다.

컴포넌트에서 상태를 변경할 수 있도록 제공되는 인터페이스는 DOM 이벤트 핸들러인데, 이는 다음과 같은 장점을 가진다.

  • 내부 구현과 종속성이 없으며 캡슐화에 위반되지 않는다.

  • 어떤 행위를 하는지 명확하다.

  • 테스트를 설명하기 위한 주석이나 설명 또한 크게 필요하지 않다.

커버리지보다는 의미 있는 테스트인지 생각하기

커버리지는 테스트 코드가 프로덕션 코드의 몇 퍼센트를 검증하고 있는지 나타내는 지표인데, 구문(statements), 분기(branches), 함수(functions), 줄(lines) 등을 기준으로 한다.

여기까지만 보면 커버리지는 테스트 코드에 매우 중요해 보이지만, 100% 커버리지를 위해 모든 것을 테스트로 검증하려는 행위는 크게 의미가 없다.

테스트 작성, 실행, 유지 보수 측면에서 너무 많은 비용이 발생하고, 설령 100% 커버리지로 작성했더라도 잘못된 검증 때문에 문제가 발생할 수 있다.

때문에 테스트 코드를 작성할 때는

  • 의미 있는 테스트인지

  • 어느 범위까지 검증해야 효율적인 테스트일지

고민하는 것이 훨씬 중요하다.

테스트 코드도 유지 보수의 대상이니 가독성을 높이기

잘 작성된 테스트 코드는 그 자체로 문서와도 같은 역할을 한다. 명확한 테스트 디스크립션이 있다면 테스트 파일만 보고 앱이 어떻게 동작하는지 파악할 수 있다.

가독성을 높이는 방법은 몇 가지가 있다.

  • 테스트하고자 하는 내용을 명확히 적기
    '리스트에서 항목이 제대로 삭제된다.'
    '항목들을 체크한 후 삭제 버튼을 누르면 리스트에서 체크된 항목들이 삭제된다.'
    첫 번째보다는 두 번째가 내용을 알아보기 더 쉬울 것이다.

  • 하나의 테스트에서는 하나의 동작만 검증하기
    테스트 코드에서도 단일 책임 원칙(SRP)을 동일하게 적용하면 가독성에 좋다.
    또한 검증의 책임도 각각의 테스트 코드에 나눠져 있어 유지 보수하기에도 편하다.