TDD 용 JavaScript 단위 테스트 도구


716

많은 JavaScript 단위 테스트 및 테스트 도구를 살펴 보았지만 완전히 TDD를 준수하는 데 적합한 옵션을 찾지 못했습니다. 그렇다면 TDD를 완벽하게 준수하는 JavaScript 단위 테스트 도구가 있습니까?

답변:


1506

카르마 또는 각도기

Karma는 Node.js로 빌드 된 JavaScript 테스트 실행기이며 단위 테스트 용입니다.

각도기는 엔드 투 엔드 테스트 용이며 Selenium 웹 드라이버를 사용하여 테스트를 진행합니다.

둘 다 Angular 팀에 의해 만들어졌습니다. 원하는 어설 션 라이브러리를 사용할 수 있습니다.

스크린 캐스트 : Karma 시작하기

관련 :

찬성 :

  • node.js를 사용하므로 Win / OS X / Linux와 호환
  • PhantomJS로 브라우저 또는 헤드리스에서 테스트 실행
  • 한 번에 여러 클라이언트에서 실행
  • 브라우저를 시작, 캡처 및 자동 종료하는 옵션
  • 개발 컴퓨터에서 또는 별도로 서버 / 클라이언트를 실행하는 옵션
  • 커맨드 라인에서 테스트를 실행하십시오 (개미 / 메이븐에 통합 가능)
  • 쓰기 테스트 xUnit 또는 BDD 스타일
  • 여러 JavaScript 테스트 프레임 워크 지원
  • 저장시 자동 실행 테스트
  • 도메인 간 프록시 요청
  • 사용자 정의 가능 :
    • 다른 테스트 프레임 워크를 감싸도록 확장 (Jasmine, Mocha, QUnit 내장)
    • 자신의 주장 / 반박
    • 기자
    • 브라우저 발사기
  • WebStorm 용 플러그인
  • Netbeans IDE에서 지원

단점 :

mocha.js

mocha.js의 기능, 강점 및 약점에 대해 언급 할 자격이 없지만 JS 커뮤니티를 신뢰하는 누군가가 추천했습니다.

웹 사이트에서보고 한 기능 목록 :

  • 브라우저 지원
  • 약속을 포함한 간단한 비동기 지원
  • 시험 범위보고
  • 문자열 차이 지원
  • 테스트 실행을위한 javascript # API
  • CI 지원 등을위한 적절한 종료 상태
  • 비 TTY의 자동 감지 및 채색 비활성화
  • 포착되지 않은 예외를 올바른 테스트 사례에 매핑
  • 비동기 테스트 타임 아웃 지원
  • 테스트 별 타임 아웃
  • 으르렁 알림 지원
  • 테스트 기간보고
  • 느린 테스트 강조
  • 파일 감시자 지원
  • 글로벌 변수 누출 감지
  • 선택적으로 정규 표현식과 일치하는 테스트를 실행하십시오.
  • 활성 루프로 "매달려"있는 것을 방지하기위한 자동 종료
  • 쉽게 메타 생성 스위트 및 테스트 사례
  • mocha.opts 파일 지원
  • 테스트 실행을 필터링하기위한 클릭 가능한 제품군 제목
  • 노드 디버거 지원
  • done ()에 대한 여러 호출을 감지
  • 원하는 어설 션 라이브러리를 사용하십시오.
  • 9 명 이상의 기자와 함께 제공되는 확장 가능한보고
  • 확장 가능한 테스트 DSL 또는 "인터페이스"
  • 각 후크 전, 후, 각 후
  • 임의 트랜스 파일러 지원 (커피 스크립트 등)
  • TextMate 번들

l 포

l 포

이것은 더 이상에, 리디렉션 존재하지 sequential.js 대신

Yolpo는 자바 스크립트 실행을 시각화하는 도구입니다. Javascript API 개발자는 API를 보여주고 알리기 위해 사용 사례를 작성하는 것이 좋습니다. 이러한 사용 사례는 회귀 테스트의 기초를 형성합니다.

AVA

AVA 로고

ES2015에 대한 지원 기능이 내장 된 미래형 테스트 러너. JavaScript는 단일 스레드이지만 Node.js의 IO는 비동기 특성으로 인해 병렬로 발생할 수 있습니다. AVA는이를 활용하여 테스트를 동시에 실행하며, 특히 IO 무거운 테스트에 유용합니다. 또한 테스트 파일은 별도의 프로세스로 병렬로 실행되므로 각 테스트 파일에 대해 더 나은 성능과 격리 된 환경을 제공합니다.

  • 최소한의 빠른
  • 간단한 테스트 구문
  • 테스트를 동시에 실행
  • 원자 테스트 작성을 시행합니다
  • 암시 적 글로벌 없음
  • 각 테스트 파일에 대한 격리 된 환경
  • ES2015에서 테스트 작성
  • 약속 지원
  • 발전기 기능 지원
  • 비동기 기능 지원
  • 관찰 가능한 지원
  • 향상된 어설 션
  • 선택적 TAP 출력
  • 클린 트레이스 트레이스

Buster.js

Node.js로 빌드 된 JavaScript 테스트 실행기 매우 모듈 식이고 유연합니다. 자체 어설 션 라이브러리와 함께 제공되지만 원하는 경우 직접 추가 할 수 있습니다. 주장 라이브러리는 당신이 다른 시험 주자와 함께 사용할 수 있도록 분리된다. 대신에 사용하는 assert(!...)또는 expect(...).not..., 그것은 사용 refute(...)멋진 트위스트 이럴이다.

브라우저 JavaScript 테스트 툴킷. 브라우저 자동화 (JsTestDriver 생각), QUnit 스타일 정적 HTML 페이지 테스트, 헤드리스 브라우저 (PhantomJS, jsdom 등)를 사용한 브라우저 테스트 등을 수행합니다. 한 번 봐 가지고 개요를 !

Node.js 테스트 툴킷. 동일한 테스트 케이스 라이브러리, 어설 션 라이브러리 등을 얻습니다. 이것은 하이브리드 브라우저 및 Node.js 코드에도 좋습니다. Buster.JS로 테스트 케이스를 작성하고 Node.js와 실제 브라우저에서 모두 실행하십시오.

스크린 캐스트 : Buster.js 시작하기 (2:45)

찬성 :

  • node.js를 사용하므로 Win / OS X / Linux와 호환
  • PhantomJS를 사용하여 브라우저 또는 헤드리스에서 테스트 실행 (곧)
  • 한 번에 여러 클라이언트에서 실행
  • NodeJS 테스트 지원
  • 개발 컴퓨터에서 서버 / 클라이언트를 실행할 필요가 없습니다 (IE 필요 없음).
  • 커맨드 라인에서 테스트를 실행하십시오 (개미 / 메이븐에 통합 가능)
  • 쓰기 테스트 xUnit 또는 BDD 스타일
  • 여러 JavaScript 테스트 프레임 워크 지원
  • 주석 처리하지 않고 테스트 연기
  • SinonJS 내장
  • 저장시 자동 실행 테스트
  • 도메인 간 프록시 요청
  • 사용자 정의 가능 :
    • 다른 테스트 프레임 워크를 감싸도록 확장하십시오 (JsTestDriver 내장)
    • 자신의 주장 / 반박
    • 리포터 (xUnit XML, 기존 도트, 사양, 탭, TeamCity 및 기타 내장)
    • 브라우저 테스트를 실행하는 데 사용되는 HTML 사용자 정의 / 바꾸기
  • TextMate 및 Emacs 통합

단점 :

  • 베타 버전에서는 버그가있을 수 있습니다.
  • Eclipse / IntelliJ 용 플러그인 없음 (아직)
  • TestSwarm *와 같은 os / browser / version으로 결과를 그룹화하지 않습니다. 그러나 테스트 결과에 브라우저 이름과 버전을 인쇄합니다.
  • TestSwarm과 같은 이전 테스트 결과 기록이 없습니다. *
  • 2014 년 5 월 기준 으로 Windows에서 완전히 작동하지 않습니다

* TestSwarm은 Continuous Integration 서버이며 Buster.js에 대해 별도의 CI 서버가 필요합니다. 그러나 xUnit XML 보고서를 출력하므로 Hudson , Bamboo 와 쉽게 통합 할 수 있어야합니다. 또는 다른 CI 서버 합니다.

테스트 스웜

https://github.com/jquery/testswarm

TestSwarm은 공식적으로 더 이상 GitHub 웹 페이지에 명시된대로 개발 중이 아닙니다. Karma, browserstack-runner 또는 Intern을 권장합니다.

재스민 속

재스민 속

이는 Ruby 또는 Ruby on Rails에 익숙한 개발자에게 관심을 가질 수있는 행동 중심 프레임 워크입니다 (아래 인용 참조). 구문은 RSpec을 기반으로합니다. Rails 프로젝트에서 테스트에 사용되는 을 합니다.

Jasmine 사양은 html 페이지 (qUnit 방식) 또는 테스트 러너 (Karma)에서 실행할 수 있습니다.

Jasmine은 JavaScript 코드를 테스트하기위한 행동 중심 개발 프레임 워크입니다. 다른 JavaScript 프레임 워크에 의존하지 않습니다. DOM이 필요하지 않습니다.

이 테스트 프레임 워크에 대한 경험이 있다면 더 많은 정보를 제공하십시오. :)

프로젝트 홈 : http://jasmine.github.io/

Q 단위

QUnit은 브라우저에서 JavaScript를 테스트하는 데 집중하면서 개발자에게 최대한의 편의를 제공합니다. 사이트에서 흐림 :

QUnit은 강력하고 사용하기 쉬운 JavaScript 단위 테스트 스위트입니다. jQuery, jQuery UI 및 jQuery Mobile 프로젝트에서 사용되며 일반적인 JavaScript 코드를 테스트 할 수 있습니다.

QUnit은 TestSwarm과 일부 이력을 공유합니다 (위).

QUnit은 원래 John Resig가 jQuery의 일부로 개발했습니다. 2008 년에는 자체 홈, 이름 및 API 설명서가 제공되어 다른 사람들도 단위 테스트에 사용할 수 있습니다. 당시에는 여전히 jQuery에 의존했습니다. 2009 년의 재 작성으로 QUnit은 완전히 독립형으로 실행됩니다. QUnit의 어설 션 방법은 QUnit의 영향을받는 CommonJS Unit Testing 사양을 따릅니다.

프로젝트 홈 : http://qunitjs.com/

시논

또 다른 훌륭한 도구는 Test-Driven JavaScript Development 의 저자 인 Christian Johansen의 sinon.js 입니다. 스스로 설명하는 것이 가장 좋습니다 :

JavaScript를위한 독립형 테스트 스파이, 스텁 및 모의. 어떤 단위 테스트 프레임 워크와도 종속성이 없습니다.

인턴

인턴 웹 사이트 이 목록에있는 다른 테스트 프레임 워크에 대한 직접적인 기능 비교를 제공합니다. 다른 JavaScript 기반 테스트 시스템보다 많은 기능을 즉시 제공합니다.

농담

새롭지 만 매우 강력한 테스트 프레임 워크 또한 스냅 샷 기반 테스트를 허용하므로 테스트 속도가 향상되고 테스트 측면에서 새로운 역학이 생깁니다.

대화 중 하나를 확인하십시오. https://www.youtube.com/watch?v=cAKYQpTC7MA

더 나은 방법 : 시작하기


2
Jasmine은 V8을 사용하여 헤드리스로 작업 할 수 있지만 대화식으로 사용할 수도 있습니다. Jasmine과 관련하여 DOM이 필요하지는 않지만 코드베이스 가 DOM에 액세스 할 수 있습니다. 규율을 사용하면 DOM에 액세스하고 HTML 픽스처와 완전히 별 개인 테스트를 실행하는 코드 부분에 대한 모의를 제거하거나 조건을 지키거나 모의를 제공 할 수 있습니다. 애드온을 사용하여 명령 줄 지원 및 설비를 얻을 수도 있습니다.
jerseyboy

2
@ rehevkor5 : Selenium은 통합 테스트를위한 도구이며 여기에서 도구는 단위 테스트를위한 도구입니다. typemock.com/unit-tests-integration-tests
모임

26
거의 모든 단일 테스트 러너는 브라우저를 사용합니다. WTF, 아무도 서버 측 에서만 단위 테스트를 실행하지 않습니까 ????

2
각 대안을 다른 답변으로 나누거나 나누는 것이 낫지 않습니까? 이 투표에 대한 현재 투표가 무효화 될 수 있지만 가장 적합하다고 생각합니다.
cregox

2
@Raisen Babel 을 사용하여 ES 2015를 대부분 연결할 수 있지만 Sindre Sorhus의 AVA 가 내장되어 있습니다.
gregers

64

보세요 JavaScript 단위 테스트를위한 프레임 워크 독립 하네스이며 Dojo 종속성이없는 DOH (Dojo Object Harness) 단위 테스트 프레임 워크 를 . Dojo Objective Harness를 사용하여 Web 2.0 애플리케이션을 테스트하는 Unit에 대한 설명이 있습니다 .

UI 테스트를 자동화하려면 (많은 개발자의 아픈 점) — doh.robot을 확인하십시오 (임시 다운 업데이트 : 기타 링크 http://dojotoolkit.org/reference-guide/util/dohrobot.html )dijit를 확인하십시오. .robotx (임시 다운) . 후자는 합격 테스트를 위해 설계되었습니다. 최신 정보:

참조 된 기사는이를 사용하는 방법, 마우스 및 / 또는 키보드를 사용하여 UI와 상호 작용하는 사용자를 에뮬레이트하는 방법 및 테스트 세션을 기록하는 방법을 설명하여 나중에 자동으로 "재생"할 수 있습니다.


Dojo Object Harness의 제안에 감사드립니다. 다른 제안들에 감사하지만 한 번에 한 걸음 씩 내립니다.
Mark Levison

나는 실제로 이전 프로젝트에서 이것을 사용했으며 귀중한 것을 발견했습니다. 그러나 다시, 나는 비교할 수 없습니다-다른 TDD 프레임 워크를 사용하지 않았습니다.
Rakesh Pai

죽은 링크를보고 해 주셔서 감사합니다. 나는 그들 중 하나를 업데이트했고, 새로운 웹 사이트에 올라 타 자마자 로봇 문서에 대한 링크를 대체 할 것이다.
Eugene Lazutkin

DOH에 대해 내가 싫어하는 한 가지는 어설 션이 실패 할 때 줄 번호가보고되지 않는다는 것입니다. 수동으로 주석 처리하고 테스트를 다시 실행하십시오.
Aram Kocharyan

Dojo는 DOH를 TheIntern 테스트 프레임 워크로 대체하고 있습니다. 인턴은 매우 강력하고 실질적으로 개선되었습니다. sitepen.com/blog/2014/02/18/…
user64141

34

Chutzpah-JavaScript 테스트 러너

JavaScript 단위 테스트를위한 테스트 러너 인 Chutzpah라는 오픈 소스 프로젝트를 만들었습니다. Chutzpah를 사용하면 명령 줄과 Visual Studio 내부에서 JavaScript 단위 테스트를 실행할 수 있습니다. 또한 TeamCity 연속 통합 서버에서의 실행을 지원합니다.


7
방금 Chutzpah를 사용하여 Visual Studio에서 Jasmine 테스트를 실행하기 시작했습니다. 테스트 파일을 마우스 오른쪽 버튼으로 클릭하고 'js 테스트 실행'또는 '브라우저에서 JS 테스트 실행'을 선택했습니다. JSTestDriver를 사용하여 동일한 자스민 테스트를 실행합니다. 테스트 파일 맨 위에로드 할 파일을 지정하기 때문에 Chutzpah를 선호합니다. JSTestDriver의 경우 별도의 구성 파일이 필요합니다.
GarethOwen


14

버스터 JS

Test Driven Javascript Development의 저자이자 Sinon 프레임 워크 인 Christian Johansen의 BusterJS 도 있습니다 . 사이트에서 :

Buster.JS는 새로운 JavaScript 테스트 프레임 워크입니다. Node.js 테스트뿐만 아니라 실제 브라우저 (JsTestDriver)에서 테스트 실행을 자동화하여 브라우저 테스트를 수행합니다.


10

google-js-test :

Google이 공개 한 JavaScript 테스트 프레임 워크 : https://github.com/google/gjstest

  • 브라우저를 실행할 필요없이 테스트 시작 및 실행 시간이 매우 빠릅니다.
  • 테스트 통과 및 실패시 모두 깨끗하고 읽기 쉬운 출력입니다.
  • 브라우저 기반의 테스트 러너JS가 변경 될 때마다 간단하게 새로 고칠 수 .
  • C ++ 용 Google 테스트 와 유사한 스타일 및 의미 .
  • Google C ++ Mocking Framework 기반의 스타일 및 의미를 가진 최소 상용구 코드 (예 : no $tearDown또는 $verifyAll) 가 필요한 내장형 모의 프레임 워크입니다 .

현재 Windows 용 바이너리가 없습니다.


1
그것은 Github에 거의 관심이없는 것 같습니다. 또한 유닉스 기반 OS가 필요합니다. 거대한 창 팬입니다. 내 Windows 컴퓨터 작별 인사와 키스하지 않고 집을 떠나지 않습니다.
vsync

8

우리는 현재 Pavlov 및 JSTestDriver와 함께 Qunit을 사용하고 있습니다. 이 접근법은 우리에게 잘 작동합니다.

Q 단위

파블로프 , 소스

jsTestDriver , 소스


전체 테스트 프로세스에서 이들 각각의 역할과 역할을 설명하는 데 관심이 있습니까?
vsync

오래 전부터 많은 계약 작업이 있었으며 이에 대한 자세한 내용을 기억하십시오.
Tom Stickel

6

당신은 전문가로서 "실제 브라우저에서 실행"을 가지고 있지만, 내 경험상 그것은 느리기 때문에 사기입니다. 그러나 이것이 가치있는 것은 브라우저 이외의 대안에서 충분한 JS 에뮬레이션이 부족하다는 것입니다. JS가 복잡하면 브라우저 테스트만으로 충분하지만 고려할 몇 가지 옵션이 더있을 수 있습니다.

HtmlUnit : "이것은 상당히 우수한 JavaScript 지원 (지속적으로 개선되고 있음)을 가지고 있으며 사용하려는 구성에 따라 Firefox 또는 Internet Explorer를 시뮬레이션하는 매우 복잡한 AJAX 라이브러리에서도 작동 할 수 있습니다." 에뮬레이션이 사용하기에 충분하면 브라우저를 구동하는 것보다 훨씬 빠릅니다.

그러나 HtmlUnit은 충분한 JS 지원을 제공하지만 Java를 좋아하지 않습니까? 아마도 :

쾌속선 : HtmlUnit이 지원하는 JRuby에서 실행되는 Watir API.

또는 유사하게

Schnell : HtmlUnit의 또 다른 JRuby 래퍼.

물론 HtmlUnit이 충분하지 않고 브라우저를 구동 해야하는 경우 Watir을 사용하여 JS를 구동 할 수 있습니다 .



3

또한 dojo , ExtJS 등과 유사한 오픈 소스 RIA 프레임 워크 인 qooxdoo의 일부인 단위 테스팅 프레임 워크에 관심이있을 수 있지만 상당히 포괄적 인 툴 체인이 있습니다.

온라인 버전의 testrunner를 사용해보십시오 . 힌트 : 왼쪽 상단의 회색 화살표를 누르십시오 (보다 명확해야 함). 선택한 테스트를 실행하는 "재생"버튼입니다.

단위 테스트를 정의 할 수있는 JS 클래스에 대한 자세한 내용은 온라인 API 뷰어를 참조하십시오. .

자동 UI 테스트 (Selenium RC 기반)는 시뮬레이터 프로젝트를 확인하십시오 .



3

Java와 Javascript 코드 생성기 ST-JS ( http://st-js.org ) 에 JUnit 통합을 추가했습니다 . 프레임 워크는 테스트 된 코드 및 단위 테스트 모두에 대해 해당 Javascript를 생성하여 코드를 다른 브라우저로 보냅니다.

단위 테스트 러너가 필요한 http 포트를 열고 테스트가 완료되면 서버를 닫으므로 별도의 서버가 필요하지 않습니다. 프레임 워크는 Java 스택 추적을 조작하여 실패한 어설 션이 JUnit Eclipse 플러그인에 올바르게 표시되도록합니다. 다음은 jQuery와 Mockjax를 사용한 간단한 예입니다.

@RunWith(STJSTestDriverRunner.class)
@HTMLFixture("<div id='fortune'></div>")

@Scripts({ "classpath://jquery.js",
       "classpath://jquery.mockjax.js", "classpath://json2.js" })
public class MockjaxExampleTest {
  @Test
  public void myTest() {
    $.ajaxSetup($map("async", false));
    $.mockjax(new MockjaxOptions() {
      {
        url = "/restful/fortune";
        responseText = new Fortune() {
          {
            status = "success";
            fortune = "Are you a turtle?";
          }
        };
      }
    });

    $.getJSON("/restful/fortune", null, new Callback3<Fortune, String, JQueryXHR>() {
      @Override
      public void $invoke(Fortune response, String p2, JQueryXHR p3) {
        if (response.status.equals("success")) {
          $("#fortune").html("Your fortune is: " + response.fortune);
        } else {
          $("#fortune").html("Things do not look good, no fortune was told");
        }

      }
    });
    assertEquals("Your fortune is: Are you a turtle?", $("#fortune").html());
  }

  private static class Fortune {
    public String status;
    public String fortune;
  }
}

당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.