2013-04-25 2 views
25

qunit (http://qunitjs.com)을 사용하여 카르마 테스트 러너 (http://karma-runner.github.io/0.8/index.html)를 가지고 놀고 있습니다. 나는 성공적으로 간단한 테스트 (100 % JavaScript)를 생성하고 실행했지만, 이제 DOM 노드와 상호 작용하는 코드를 테스트하기 위해 HTML 픽스쳐를 사용하려고한다. 나는이 방법으로 "파일"에서 그들을 선언함으로써이기구를로드 할 수 있어요 : 그것은 카르마의 서버에서 제공받을Qunit을 사용하여 Karma 테스트 러너와 함께 HTML 비품을 사용할 수 있습니까?

{pattern: 'fixtures/myfixture.html', watched: true, served: true, included: false} 

,하지만 난 그것의 DOM에 액세스 할 수있는 방법을 이해하지 못하는 :(

?

의 내기구는 다음과 같은 마크 업이 포함 된 간단한 HTML 파일입니다 가정하자 : 그 노드 (사업부)에 액세스 할 수있는 테스트를 작성할 수있는 방법

<div id="container">hello world</div> 

을 은 "문서"에 관련된다 " context.html "파일을"static "폴더 아래에 있습니다 ... 그래서 HTM은 어디에 있습니까? 내 정착물의 L ??

+0

여기 내 대답을 확인하십시오 : 내 테스트 파일에서 다음

frameworks = ['qunit', 'jasmine']; files = [ JASMINE, JASMINE_ADAPTER, QUNIT, QUNIT_ADAPTER, // dependencies {pattern: 'src/main/webapp/js/libs/jquery/jquery-1.8.3.js', watched: false, served: true, included: true}, {pattern: 'src/test/js/lib/jasmine-jquery.js', watched: false, served: true, included: true}, // fixtures {pattern: 'src/test/js/**/*.html', watched: true, served: true, included: false}, {pattern: 'src/test/js/**/*.json', watched: true, served: true, included: false}, {pattern: 'src/test/js/**/*.xml', watched: true, served: true, included: false}, // files to test {pattern: 'src/test/js/**/*.js', watched: true, served: true, included: true} ]; 

: 내 구성 파일에서 나는 다음을 http://stackoverflow.com/questions/15214760/unit-testing- angularjs-directive-with-templateurl/16528985 # 16528985 –

답변

23

AngularJS를 사용하고 있지 않습니다. ... jasmine-jquery를 채택하여 해결했습니다 : https://github.com/velesin/jasmine-jquery (필자는 jasmine을 픽스처에만 사용하고 테스트는 여전히 qunit을 사용하여 작성되었습니다).

module("TestSuiteName", { 
    setup: function() { 
     var f = jasmine.getFixtures(); 
     f.fixturesPath = 'base'; 
     f.load('src/test/js/TestFixture.html'); 
    }, 
    teardown: function() { 
     var f = jasmine.getFixtures(); 
     f.cleanUp(); 
     f.clearCache(); 
    } 
}); 
+0

좋은 일 친구. 그래도 JASMINE과 JASMINE_ADAPTER가 필요합니까? – NickL

+8

나를 위해 작동하도록하려면 "전 처리기 : { '**/*. html': []}"을 추가해야했습니다. 이것은 카르마 0에서 기본적으로 켜져 있던 html2js 전처리기를 제거합니다.10 –

+0

[카르마의 전처리기에 관한 github 문제 토론] (https://github.com/karma-runner/karma/issues/788). – jfroom

8

AngularJS를 사용하는 경우 html2js 전 처리기를 사용할 수 있습니다. 예를 들어 수행하는 방법은 https://github.com/vojtajina/ng-directive-testing입니다.

이러한 html 파일은 카르마에서 제공하지만 페이지에 포함되어 있지 않으므로 아마도 xhr 요청을 통해 가져와야합니다. 여기

이 (각도에 꽉되지 않음) JS 문자열로 HTML 파일을 변환하는 유사한 처리기입니다 : 전처리가이 html2js : https://github.com/karma-runner/karma-html2js-preprocessor/tree/master/e2e-test

참고 : https://github.com/karma-runner/karma-html2js-preprocessor 당신은 E2E 테스트에서 사용하는 방법을 볼 수 있습니다 카르마 0.8의 일부가 아니며 플러그인은 카르마 0.9+ (현재는 카나리아 채널)에서만 작동하므로 카나리아 (변경 사항이 많이 포함 된 -))를 사용해야합니다 ...

+0

나는 또한 카르마로 DOM을 테스트하는 데 정말로 관심이 있습니다. 향후 릴리스에서 사용할 수 있습니까? 아니면 해결 방법을 찾아야합니까? 아마 Angular를 사용하지 않을 것입니다. – zigomir

+0

karma의 카나리아 릴리즈를 사용하면 (결국 안정적이 될 것입니다 ;-) AngularJS에 꼭 맞지 않는 karma-html2js-preprocessor 플러그인을 사용하십시오. – Vojta

+1

npm에 canary release를 설치하는 방법은 무엇입니까? 바보 같은 질문에 사과드립니다. –