프론트엔드 테스트코드 책 추천

읽게 된 이유

회사 프로덕트의 테스트 코드가 5%도 작성되지 않은 상황이었습니다. 마침 기술 부채 스프린트를 진행하게 되었고, 팀원들과 테스트 코드를 강화하는 방향으로 논의하게 되었습니다.
저는 이전에 간단한 테스트 코드만 작성해본 경험이 있었기 때문에 더 학습이 필요하다고 느꼈는데요. 그래서 관련 아티클을 찾아 읽고, 강의를 들으며 공부를 했습니다.
하지만 강의는 원하는 정보를 전부 알려주지 않았고, 구글링한 정보들도 파편화되어 답답함을 느꼈습니다.
그러던 중에 제이펍 출판사의 테스트 코드 책을 읽고, 가려웠던 부분들이 해소되는 느낌을 받았습니다.

책에서 배운 것들

책 제목처럼, 단위 테스트부터 E2E 테스트까지 개념을 설명해줍니다. 그리고 상황별로 어떻게 적용해야 하는지 예제도 보여줍니다.
특히 요즘 트렌드인 Next.js로 만든 예제가 많아 유용합니다.

옮긴이 머리말

처음 일본에서 프런트엔드 엔지니어로 참여했던 프로젝트에서 한 시니어 엔지니어에게 들었던 이야기가 있다.
"테스트 코드? 그건 도시 전설이지. 나는 실무에서 한 번도 본 적이 없어."

실무에서 테스트 코드를 적용하는 데는 여러 장벽이 있는데요. 이 책은 왜 테스트 코드를 작성해야 하고, 어떻게 동료들을 설득해야 하는지에 대한 저자의 의견도 담겨 있습니다.

저는 개념적인 내용도 중요하지만, 다른 사람의 의견을 보면서 사고를 넓히는 것이 좋았습니다.

테스트 작성의 장벽 (p.9)

• 테스트를 작성하는 습관이 없어서 어떻게 시작해야 할지 모르겠다.
• 테스트를 작성할 시간에 기능을 추가하고 싶다.
• 팀원들의 기술력이 부족해 유지할 자신이 없다.

책에서는 Jest와 Playwright를 이용해 테스트 도구를 설명합니다.

처음 Jest를 사용할 때 목 객체를 가리키는 stub와 spy, 그리고 목 객체에 대한 용어들이 헷갈렸었는데요. 이 책은 테스트 코드 작성이 어려운 개발자가 헷갈릴 수 있는 지점들을 명확하게 설명해줍니다. 또한, 커버리지 리포트를 테스트 코드별로 사례를 통해 지표를 어떻게 이해해야 하는지 알려줍니다.

제스트의 용어 혼란 (p.55)

제스트의 API는 <xUnit 테스트 패턴>의 용어 정의를 충실하게 따르지 않는다. 제스트는 스텁, 스파이를 구현할 때 목 모듈(jest.mock) 혹은 목 함수(mock.fn, jest.spyOn)라는 API를 사용한다. 제스트는 이를 구현한 테스트 대역을 목 객체라고 부르는 등 <xUnit 테스트 패턴>에서 정의한 용어와는 다른 부분이 많다.

이 책에서는 앞서 설명한 스텁 혹은 스파이로서 사용하는 명확한 이유가 있을 때는 '스텁', '스파이'라고 구분하고, 여러가지 이유로 사용될 때는 '목 객체'라고 하겠다.

이런 점에서 이 책이 정말 세심하게 쓰여졌다는 것을 느낄 수 있었습니다. (제가 헷갈렸던 내용들이 이해하기 쉽게 설명되어 있더라구요. 허허)

추천 독자

• 테스트 코드를 작성해본 경험이 없는데 이대로 괜찮은 건지 모르겠다.
• 테스트 코드를 작성하고 있지만 제대로 작성하는 건지 자신이 없다.
• 다른 개발자들은 어떻게 테스트 코드를 작성하는지 궁금하다.

입문서라는 제목에 맞게 테스트 코드를 처음 시작하는 분들에게 적극 추천드립니다.
다양한 컴포넌트 테스트 사례도 많기 때문에 테스트 코드 작성 경험이 많지 않은 개발자 분들에게도 도움이 될 거 같습니다 🔥