Unit test in javascript

1

• 기본 개념
  • 입력값과 반환값이 있으면 테스트 비교적 쉬움
  • 브라우저 렌더링 버그는 테스트X
  • 테스트 케이스 만들기 까다로운거
    • DOM을 조작한 결과
    • 복잡한 이벤트(drag…)
    • 비동기 테스트(Ajax, setInterval…)
• Qunit API
  • module
  • test
  • equal
• 테스트 케이스 만들 때 유의사항
  • 테스트 케이스 의존관계 없어야함
  • Given/When/Then 구분해 만들자
  • 모든 코드에 테스트 케이스는 만들지 않는다
• 실습
  • 테스트

2

• DOM 조작 후 테스트 방법
  • class 변경
  • 속성 변경
  • DOM 변경
• 유의할 점
  • 브라우저마다 렌더링된 마크업이 다를 수 있음
    • innerHTML이 브라우저마다 대/소문자로 반환
    • 속성의 위치가 다름
• 실습

3

• 이벤트(Click, mouseover…)관련 테스트
  • 가짜로 이벤트를 실행시켜 테스트하는 방법
  • 이벤트에 의존하지 않게 테스트하는 법
• 유의할 점
  • 가짜로 이벤트를 만들어 처리하면 복잡한 인터렉션은 테스트하기 까다로움
• 실습

4

• Ajax 테스트 법
  • 실제 Ajax통신 후 테스트
  • Ajax 의존성 없이 테스트
• 유의할 점
  • 동기로 동작하는 경우는 문제없음
  • 비동기 통신의 테스트는 정상적이어도 fail될 수 있음
    • 대기하여 테스트 하거나 //현업에선 이걸 가장 많이 씀
    • 로직을 분리하거나
    • Mock을 이용하여 테스트 //이게 가장 깔끔
• 실습