1. Qunit이란 무엇입니까?
Qunit (http://qunitjs.com/)은 코드를 디버깅하는 데 도움이되는 매우 강력한 JavaScript 장치 테스트 프레임 워크입니다. jQuery 팀원이 작성했으며 jQuery의 공식 테스트 세트입니다. 그러나 Qunit은 일반적으로 일반 JavaScript 코드를 테스트하기에 충분하며 Rhino 또는 V8과 같은 일부 JavaScript 엔진을 통해 서버 측 JavaScript를 테스트 할 수도 있습니다.
"단위 테스트"라는 개념에 익숙하지 않다면 걱정하지 마십시오. 이해하기 어렵지 않습니다.
코드 사본은 다음과 같습니다.
컴퓨터 프로그래밍에서 단위 테스트 (모듈 테스트라고도 함)는 프로그램 모듈 (소프트웨어 디자인의 가장 작은 단위)에서 정확성 테스트를 수행하는 테스트입니다. 프로그램 단위는 응용 프로그램에서 가장 작은 테스트 가능한 구성 요소입니다. 절차 프로그래밍에서 단위는 단일 프로그램, 기능, 절차 등입니다. 객체 지향 프로그래밍의 경우 가장 작은 장치는 기본 클래스 (슈퍼 클래스), 추상 클래스 또는 파생 클래스 (하위 클래스)의 메소드를 포함한 방법입니다. - Wikipedia에서 인용했습니다.
간단히 말해, 코드의 모든 기능에 대한 테스트를 작성하고 이러한 모든 테스트가 통과되면 코드에 결함이 없는지 확인할 수 있습니다 (일반적으로 테스트의 철저한 방법에 따라 다릅니다).
2. 코드를 테스트하려는 이유는 무엇입니까?
이전에 단위 테스트를 한 적이 없다면 코드를 웹 사이트에 직접 업로드하고 잠시 클릭하여 문제가 발생하는지 확인하고 찾은 문제를 해결하려고 시도 할 수 있습니다. 이 방법에는 많은 문제가있을 것입니다.
우선, 이것은 매우 성가신 일입니다. 클릭은 실제로 쉬운 일이 아닙니다. 모든 것이 클릭되어야하고 한두 가지를 놓친 기회가 있기 때문입니다.
둘째, 테스트를 위해하는 모든 일은 재사용 할 수 없으므로 회귀하기가 어렵다는 것을 의미합니다. 반품이란 무엇입니까? 코드를 작성하고 테스트하고 찾은 모든 결함을 고치고 게시 한 다음 게시한다고 상상해보십시오. 이 시점에서 사용자는 새로운 결함에 대한 피드백을 보내고 새로운 기능이 필요합니다. 코드로 돌아가서 새로운 결함을 수정하고 새로운 기능을 추가하십시오. 다음에 일어날 수있는 일은 일부 오래된 결함이 다시 나타나며 "반환"이라고합니다. 이제 다시 클릭해야하며,이 오래된 부담 결함을 찾을 수 없을 수도 있습니다. 그렇게하더라도 문제가 회귀로 인해 발생한다는 것을 알아내는 데 약간의 시간이 걸릴 것입니다. 단위 테스트를 사용하면 결함을 찾기 위해 테스트를 작성하고 코드가 수정되면 다시 테스트를 통해 필터링됩니다. 회귀가 발생하면 일부 테스트는 확실히 실패하며이를 쉽게 인식하고 코드의 어느 부분에 오류가 포함되어 있는지 알 수 있습니다. 이제 당신은 지금 당신이 지금 수정 한 것을 알았으므로 쉽게 해결할 수 있습니다.
특히 웹 개발을위한 단위 테스트의 또 다른 장점 : 크로스 브라우저 호환성 테스트를 쉽게 만듭니다. 다른 브라우저에서 테스트 케이스를 실행하십시오. 하나의 브라우저에 문제가있는 경우 다른 브라우저에 회귀가 없는지 확인하기 위해이 테스트 케이스를 수정하고 다시 실행합니다. 모두 테스트를 통과하면 모든 대상 브라우저가이를 지원한다고 확신 할 수 있습니다.
John Resig : Testswarm (http://testswarm.com/)의 프로젝트를 언급하고 싶습니다. JavaScript 단위 테스트는 새로운 수준으로 이동하여 배포함으로써 다른 테스트 사례를 실행하여 결과를 서버로 반환 할 수있는 많은 테스트 사례가 포함 된 웹 사이트입니다. 이러한 방식으로 코드는 다른 브라우저에서 매우 빠르게 테스트하거나 다른 플랫폼에서 실행됩니다.
3. Qunit으로 단위 테스트를 작성하는 방법
그렇다면 Qunit으로 단위 테스트를 어떻게 올바르게 작성합니까? 먼저 테스트 환경을 설정해야합니다.
코드 사본은 다음과 같습니다.
<! doctype html>
<html>
<헤드>
<title> Qunit Test Suite </title>
<link rel = "Stylesheet"href = "http://github.com/jquery/qunit/raw/master/qunit/qunit/qunit.css"type = "text/css"media = "screen">
<script type = "text/javaScript"src = "http://github.com/jquery/qunit/raw/master/qunit/qunit/qunit.js"> </script>
<!-프로젝트 파일이 여기에 있습니다->
<script type = "text/javaScript"src = "myProject.js"> </script>
<!-테스트 파일이 여기에 있습니다->
<script type = "text/javaScript"src = "myTests.js"> </script>
</head>
<body>
<h1 id = "Qunit-Header"> Qunit Test Suite </h1>
<h2 id = "Qunit-Banner"> </h2>
<div id = "Qunit-testrunner-toolbar"> </div>
<h2 id = "Qunit-Useragent"> </h2>
<ol id = "Qunit-tests"> </ol>
</body>
</html>
보시다시피, 관리되는 Qunit Framework 버전이 여기에서 사용됩니다.
테스트 할 코드는 MyProject.js에 추가되었으며 테스트를 MyTest.js에 삽입해야합니다. 이 테스트를 실행하려면 브라우저에서 HTML 파일을 열기 만하면됩니다. 이제 몇 가지 테스트를 작성해야합니다.
단위 테스트의 초석은 다음과 같습니다.
주장은 코드의 반환 결과를 예측하는 제안입니다. 예측이 거짓이고 주장이 실패하면 무언가 잘못되었음을 알 수 있습니다.
어설 션을 실행하면 테스트 사례에 넣어야합니다.
코드 사본은 다음과 같습니다.
//이 기능을 테스트합시다
기능 iseven (val) {
반환 val % 2 === 0;
}
test ( 'iseven ()', function () {
OK (ISEEVEN (0), 'ZERO는 짝수 숫자');
OK (Iseven (2), '두 개도');
OK (ISEEVEN (-4), '음의 4도');
OK (! iseeven (1), '하나는 짝수가 아닙니다');
OK (! iseven (-7), '부정적인 일곱은 아니다');
})
여기서 우리는 기능을 정의합니다. iSeven은 숫자가 홀수인지 여부를 감지하는 데 사용 되며이 기능을 테스트하여 답변을 반환하지 않을 것임을 확인하려고합니다.
테스트 케이스를 구축하는 Test ()를 먼저 호출합니다. 첫 번째 매개 변수는 결과에 표시 할 문자열이며, 두 번째 매개 변수는 인터럽트 마스터를 포함하는 콜백 함수입니다.
우리는 5 가지 주장을 썼는데,이 모든 것은 부울입니다. 첫 번째 주장이 사실이 될 것으로 기대하는 부울 주장. 두 번째 매개 변수는 여전히 결과에 표시되는 메시지입니다.
테스트를 실행하는 한 다음은 다음과 같습니다.
4. 심층 학습 참조
위의 내용은 Qunit.js를 간단히 소개하며 많은 주장 방법이 있습니다. 자세한 내용은 API 문서를 참조하십시오.
http://api.qunitjs.com/
단위 테스트는 코드를 게시하기 전에 코드를 테스트하는 매우 좋은 방법입니다. 전에 단위 테스트를 작성하지 않았다면 지금은 시작할 때입니다!