코드를 테스트하고 코드에 대한 테스트 케이스를 만드는 과정을 개인적으로는 코드를 "미리검증(future-proofing)"하는 일이라고 본다. 작성된 코드와 라이브러리에 대한 테스트 케이스를 만들어놓으면 이상한 버그를 잡으면서, 게다가 자기도 모르는 사이에 코드에 새로운 버그를 집어넣으면서 디버깅하느라 보낼 지도 모르는 수많은 시간을 절약할 수 있다.
JSUnit : http://www.jsunit.net/ 자바스크립트 단위 테스트 라이브러리이다. JSUnit에는 세 가지 기본 컴포넌트가 존재한다. 테스트 러너(test runner) : 테스트 묶음에서 테스트 러너 부분은 현재 테스트 과정이 얼마나 진행되었는지 알기 쉬운 그림으로 보여준다. 테스트 묶음을 로드하고 그 내용을 실행하고 결과를 기록하는 기능을 제공한다. 테스트 묶음(test suite) : 테스트 케이스들의 묶음을 말한다.(가끔 여러 웹 페이지에 나뉘어 있기도 하다.) 테스트 케이스(test case) : 참/거짓을 나타내는 간단한 표현식이다. 코드가 제대로 작동하고 있는지 확인할 수 있는 수치화한 결과를 돌려준다. 테스트 케이스만으로는 완벽하지 않으며, 테스트 러너와 함께 사용하면 인터렉티브한 테스트 환경을 제공한다.
ex) test suite
<html> <head> <title>JsUnit Test Suite</title> <script src="../app/jsUnitCore.js"></script> <script> function suite() { var newsuite = new top.jsUnitTestSuite(); newsuite.addTestPage("jsUnitTests.html"); return newsuite; } </script> </head> <body></body> </html>
ex) test case
<html> <head> <title>JsUnit Assertion Tests</title> <script src="../app/jsUnitCore.js"></script> <script> // Test that an expression is true function testAssertTrue() { assertTrue("true should be true", true); assertTrue(true); }
// Test that an expression is false function testAssertFalse() { assertFalse("false should be false", false); assertFalse(false); }
// Tests to see if two arguments are equal to each other function testAssertEquals() { assertEquals("1 should equal 1", 1, 1); assertEquals(1, 1); }
// Tests to see if they're not equal to each other function testAssertNotEquals() { assertNotEquals("1 should not equal 2", 1, 2); assertNotEquals(1, 2); } // Tests to see if the argument is equal to null function testAssertNull() { assertNull("null should be null", null); assertNull(null); }
// Of is not equal to null function testAssertNotNull() { assertNotNull("1 should not be null", 1); assertNotNull(1); }
// plus many many more </script> </head> <body></body> </html>
<html> <head> <title>Sample Test</title> <script src="js/unittest.js" type="text/javascript"></script> <script src="js/suiterunner.js" type="text/javascript"></script> </head> <body> <p id="title">Sample Test</p> <script type="text/javascript"> new Test.Unit.Runner({ // Test hiding and showing an element testToggle: function() {with(this) { var title = document.getElementById("title"); title.style.display = 'none'; assertNotVisible(title, "title should be invisible"); element.style.display = 'block'; assertVisible(title, "title should be visible"); }},
// Test appending an element to another testAppend: function() {with(this) { var title = document.getElementById("title"); var p = document.createElement("p"); title.appendChild( p );
ex) 테스트를 위해 Test.Simple과 Test.More을 사용하는 예 // Test 모듈을 로드한다.(테스트 자체도 함께!) new JSAN('../lib').use('Test.More');
// 여섯 가지 테스트를 실행한다고 알린다. (언제, 무엇이 잘못되었는지 알기 위해) plan({tests: 6});
// 세 가지 간단한 경우를 테스트 한다. ok( 2 == 2, 'two is two is two is two' ); is( "foo", "foo", 'foo is foo' ); isnt( "foo", "bar", 'foo isnt bar');
// 정규 표현식을 사용해 테스트한다. like("fooble", /^foo/, 'foo is like fooble'); like("FooBle", /foo/i, 'foo is like FooBle'); like("/usr/local/", '^\/usr\/local', 'regexes with slashes in like' );