참고 : 자바스크립트 닌자 비급

■ 자바스크립트 테스트 방식

로버트 프로스트(Robert Frost)는 좋은 울타리가 좋은 이웃을 만든다고 했다.

웹 애플리케이션의 세계에서는 그리고 모든 프로그래밍 수련에서는, 좋은 테스트가 좋은 코드를 만든다.

"좋은"이라는 단어를 강조하고 있다는 것을 기억하라.

광범위한 테스트 스위트를 가지고 있다고 하더라도 테스트들이 제대로 만들어져 있지 않다면

코드의 품질을 향상시키는 데는 조금도 도움이 되지 않는 상황이 발생할 수 있다.

좋은 테스트는 다음 세가지 특성이 있다.

#01. 반복성

테스트 결과는 항상 재현 가능해야 한다.

테스트가 반복적으로 실행되면, 항상 정확히 같은 결과를 내야 한다.

테스트 결과가 그때그때 다르다면, 어떻게 그 결과를 맞다고 혹은 틀리다고 할 수 있을까?

뿐만 아니라 재현 가능성은 테스트가 네트워크나 CPU 부하 등의 외부 요인과 독립적이라는 것을 보장하낟.

#02. 간결성

테스트는 테스트를 하는 것에만 집중해야 한다.

테스트 코드의 의도를 훼손하지 않는 한,

가능한 많은 HTML 마크업, CSS, JavaScript를 제거하기 위해서 노력해야 한다.

더 많이 제거 할수록, 테스트 대상이 아닌 코드가 테스트 케이스에 영향을 줄 확률이 낮아진다.

#03. 독립성

각 테스트는 독립적으로 동작해야 한다.

테스트의 결과가 다른 테스트에 의존적이 되는 것을 피해야 한다.

테스트를 가능한 작은 단위로 분리하는 편이 에러가 났을 때 정확한 버그의 원인을 찾는데 도움이 될 것이다.

테스트를 만드는 방법은 여러 가지가 있는데,

크게 제거적(Deconstructive) 테스트와 추가적(Constructive) 테스트가 있다.

#01. 제거적 테스트 케이스

문제를 격리하기 위해 테스트와 상관 없는 모든것을 제거하여 기존의 코드가 줄어들면,

제거적 테스트 케이스가 만들어진다.

이는 앞서 예로 든 세 가지 특성을 얻는데 도움이 된다.

추가적인 마크업, CSS, JavaScript를 제거한 웹 사이트로 테스트를 시작할 수 있다.

문제를 재현할 수 있는 보다 작은 경우에 도달하게 될 것이다.

#02. 추가적 테스트 케이스

추가적 테스트 케이스를 이용할 때는 올바르다고 알고 있는,

작은 테스트 케이스를 가지고 확인하려는 버그가 재현될 때가지 테스트 케이스를 늘려 나간다.

이 스타일의 테스트를 사용하려면,

테스트를 구축할 수 있는 간단한 테스트 파일 몇 개와 코드의 깨끗한 사본을 가지고 테스트를 생성하는 방법이 필요하다.

추가적 테스트 예제를 살펴보자.

작은 테스트 케이스를 생성할 때, 소수의 HTML 파일과 그 HTML 파일에 이미 포함되어 있는 최소한의 기능만으로 시작할 수 있다.

예를 들면, 한 파일은 DOM 조작 기능만 있고, 다른 한 파일에는 Ajax 테스틈만 있으면,

다른 하나에는 애니메이션 테스트 기능만 있는 식으로 여러 기능을 서로 다른 파일에 둘 수 있다.

다음 코드는 jQuer를 테스트하는 데 쓰이는 간단한 DOM 테스트를 예로 들고 있다.

jQuery를 위해 축소한 DOM 테스트 케이스

깨끗한 상태에서 테스를 만들기 위해서, 다음과 같이 간단한 쉘 스크립트를 이용해 라이브러리를 체크아웃하고

거기다가 테스트 케이스를 복하나 다음 테스트 스위트를 빌드하도록 할 수 있다.

./get.sh mytest dom

이는 dom.html로부터 DOM 테스트 케이스를 가져와서, 로컬 Git 저장소에 해당 테스트 케이스를 추가한다.

다른 대안은 간단한 테스트 케이스를 생성하기 위해 미리 구축된 서비스를 이용하는 것이다.

이런 서비스 중 하나는 JS Bin(http://jsbin.com/)이다.

이 서비스는 간단히 테스트 케이슬르 만들고 유일한 URL을 통해서 접근할 수 있게 해준다.

(심지어 몇몇 유명한 자바스크립트 라이브러리를 복사해서 테스트에 포함시킬 수도 있다.)

테스트 케이스를 생성하는데 필요한 도구와 지식을 갖추면, 테스트 케이스를 모아놓은 테스트 스위트를 구축할 수 있고,

이로 인해 테스트를 반복해서 실행하는 것이 쉬워진다.