[클린코드 JS] 11. 테스트 만들기

Serin-B·2023년 7월 1일
0

클린코드JS

목록 보기
11/15
post-thumbnail

테스트를 왜 만들어야 할까?

테스트는 특정한 입력을 넣었을 때, 원하는 대로 동작하고, 올바른 결과가 출력되는지 확인하는 과정이다. 예를 들어 계산기 어플을 만들었을 때, 숫자 1 버튼연산자 + 버튼, 숫자 3 버튼 을 순서대로 누루면 결과 화면에 4가 뜨는지 테스트 케이스를 작성하고, 확인할 수 있다.

테스트 케이스가 없으면 변경이 불안해진다. 어떤 부분에서 오류가 날지 모르기 때문에 모든 변경이 잠정적인 버그인 셈이다. 따라서 테스트케이스가 없으면 변경과 리펙토링을 미루게 된다.

그러나 테스트 케이스가 있으면 변경이 두렵지 않으므로 쉽게 변경이 가능하다. 테스트가 통과된 다는 것은 결국 원하는대로 여전히 잘 동작하고 있다는 증거이므로, 테스트 케이스를 통해 손쉽게 안전성을 확인받을 수 있다. 또한 테스트는 유연성, 유지보수성, 재사용성을 제공한다.

즉, 우리는 빠르게 원하는 기능이 제대로 동작하는지 확인하고, 코드를 변경한 이후에도 여전히 정상적으로 동작하는지 빠르게 확인하기 위해 테스트 케이스가 필요하다!

테스트 주도 개발(TDD)

테스트 주도 개발(TDD, Test Driven Development)이란
말 그대로 테스트가 개발을 주도한다는 것이다. 즉, 테스트를 먼저 만들고, 해당 테스트가 통과할 수 있게 개발 코드를 작성하는 것을 말한다.

테스트 주도 개발을 하면, 리펙토링을 할 때 기존의 동작에 영향을 미치거나 되던 기능이 안되는 불상사가 일어나지 않도록 막을 수 있다. 즉, 원하는 대로 동작하는지 빠르게 피드백을 받을 수 있다. 이처럼 TDD의 핵심은 더 자주, 더 빨리 피드백을 받는 것이다! 그러므로 너무 오래 걸리는 테스트보다는 작은 단위로 빠르게 실행하고 결과를 볼 수 있는 방향으로 작성하는 것이 좋다.

TDD를 하는 순서

일반적으로 통용되는 TDD를 하는 순서는 아래와 같다.

  1. 실패하는 테스트 코드를 작성한다.
  2. 그 테스트를 통과할 수 있는 코드를 작성한다.
  3. 리펙토링한다.

그러나 TDD에 익숙하지 않다면 위의 3단계는 지나치게 축약적인 설명이라고 느껴질 수 있다. 그렇다면 더 자세한 설명을 위해 워드 커닝햄이 제안하는 TDD를 하기 위한 10단계를 살펴보자.

워드 커닝햄에 제안하는 TDD를 하는 10단계

  1. 하고 싶은 일을 생각하라.
  2. 테스트하는 방법에 대해 생각하라.
  3. 작은 테스트를 작성하면서 원하는 api를 생각하라.
  4. 테스트에 실패할 만큼의 코드를 작성하라.
  5. 실행하고 테스트가 실패하는지 확인하라.
  6. 테스트를 통과할 만큼의 코드를 작성하라.
  7. 실행하고 모든 테스트가 통과되는지 확인하라. 이때 통과하지 못하면 뭔가가 잘못된 것이므로 방금 작성한 부분을 확인하고 수정하라.
  8. 중복이 있는경우 제거하고 재사용성을 높이기 위해 리펙토링하라. 여기에는 결함도 감소 및 응집도 증가각 포함된다.
  9. 테스트를 다시 실행하면 여전히 모든 테스트가 통과해야 한다. 만약 실패한다면 리펙토링 과정에서 실수한 것이므로 수정하고 다시 실행하라.
  10. 새 코드를 작성하는 테스트를 더 이상 찾을 수 없을 때까지 위의 단계를 반복하라.

참조 : http://wiki.c2.com/?TestDrivenDevelopment

테스트 케이스 작성 Tip

첫째, 하나의 테스트는 한 가지 기능만 테스트하여야 한다. 따라서 동작 가능한 가장 작은 단위로 테스트 케이스를 작성하여야 한다.

둘째, 테스트 케이스를 작성할 때에는 핵심부터 포함하도록 한다. 즉, 원하는 결과에서 가장 중요하게 생각되는 부분부터 테스트 케이스를 작성하는 것이 좋다.

셋째, 아는 것에서 모르는 것으로, 작은 개념에서 큰 개념으로 점차 확장되도록 테스트 케이스를 작성한다. 테스트 케이스를 짜는 순서대로 개발의 순서가 정해지기 때문에 점차 확장되는 형태로 작성하는 것이 좋다.


참조

  • 도서 Clean Code(클린 코드) / 로버트 C. 마틴 / 2013.12.24.
  • Udemy 강의 TDD로 배우는 웹 프론트엔드 / Maker Jun / 2023. 4.
profile
프론트엔드 개발자

0개의 댓글

관련 채용 정보