2016-06-19 10 views
0

BDD/TDD를 배우기 위해 작은 페이지를 작성했습니다. 그것은 http://duolingo.howyousay.it/link.htmlonready 전에 실행되는 코드 부분을 테스트하려면 어떻게해야합니까?

내 시험 (순간에 하나 개의 파일 만) http://duolingo.howyousay.it/tests/test.html?coverage&hidepassed&noglobals

에서 내가 http://duolingo.howyousay.it/duolingo_link_fixer.js

1 var DuolingoLinkFixer = function() { 
    2 this.data = {}; 
    3 var self = this; 
    4 
    5 document.onreadystatechange = function() { 
* 6  self.init(); 
    7 } 
    8 }; 
    9 
    10 DuolingoLinkFixer.prototype.init = function() { 
* 11 if (document.readyState == "complete") { 
* 12  this.setOriginalUrl(); 
* 13  this.setAlternateText(); 
* 14  this.setFixedUrl(); 
    15 } 
    16 } 

라인 6에서 5 선을 제외하고 100 %의 코드 커버리지를 얻기 위해 관리했습니다 있습니다에있다 11-14는 테스트를받지 않지만 코드를 제거하면 코드가 작동하지 않습니다. 저는 QUnit, QUnit-BDD 및 Blanket.js를 사용하고 있습니다. onready 이전에 실행되는 코드 부분을 테스트하려면 어떻게합니까? onready 이후에만 테스트가 시작되는 것 같습니다.

내 테스트 코드는 현재 다음과 같이 시작합니다

describe("DuolingoLinkFixer", function() { 
    describe("new", function() { 
    it("should create a new instance of DuolingoLinkFixer", function() { 
     expect(new DuolingoLinkFixer instanceof DuolingoLinkFixer).to.be.true(); 
    }); 
    }); 

}); 

이 내 테스트 HTML 페이지의 소스입니다 :

<!DOCTYPE html> 
<html> 
    <head> 
    <title>Duolingo JavaScript tests</title> 

    <script type="text/javascript" src="/lib/jquery/jquery-3.0.0.js"></script> 
    <script type="text/javascript"> 
     $.holdReady(true); 
    </script> 

    <link type="text/css" rel="stylesheet" href="/lib/qunit/qunit-1.23.1.css"> 
    <script type="text/javascript" src="/lib/qunit/qunit-1.23.1.js"></script> 
    <script type="text/javascript" src="/lib/qunit-bdd/qunit-bdd.js"></script> 

    <script type="text/javascript" src="/lib/blanket.js/blanket.min.js"></script> 

    <script type="text/javascript" data-cover src="../url_helper.js"></script> 
    <script type="text/javascript" data-cover src="../duolingo_link_fixer.js"></script> 

    <script type="text/javascript" src="test_url_helper.js"></script> 
    <script type="text/javascript" src="test_duolingo_link_fixer.js"></script> 
    </head> 
    <body> 
    <div id="qunit"></div> 
    </body> 
</html> 

내가 추가하는 시도 jQuery의 $.holdReady(true); 다른 게시물에 제안하지만 'didn를로 도와 줘. jQuery를 사용할 필요가 없으므로이 프로젝트를 피하려고합니다. 그것이 의해 트리거 된 것처럼

describe("DuolingoLinkFixer", function() { 
    describe("new", function() { 
    it("should create a new instance of DuolingoLinkFixer", function() { 
     expect(new DuolingoLinkFixer instanceof DuolingoLinkFixer).to.be.true(); 
     document.onreadystatechange(); 
    }); 
    }); 

}); 

정확히 같은 document.onreadystatechange(); 실행 코드를 추가 :

+0

첫 번째로해야 할 일은'console.log ("여기에 나는");'을 사용하여 출력물을 추가하는 것입니다. 그러면 초점을 잘 맞출 수 있습니다. – FDavidov

+0

이것은 할 여유가 있을지 모르지만 ... 준비된 이벤트를 생성하고 페이지 상단의 이벤트를 내 보냅니다 ... idk 구문을 사용할 수 있습니다. var e = document.createEvent ('ready'); e.emitChange(); 정확한 구문에 대해 다시 확신하지 못함 –

+0

@FDavidov 문서에서 찾았습니다 : https://api.qunitjs.com/QUnit.config/'자동 시작 '을 해제하고 수동으로 시작할 수 있다고 말합니다 _after_' onready'가 아니라'onready'가 발생하자마자. 수동으로 시작하는 것이 가능하다면 해결하지 못했습니다. –

답변

0

는 내가 단지 이전에 검증 할 코드를 테스트하기 위해 내 테스트 코드에 한 줄을 추가 할 필요가 있다고 밝혀졌다 readyStateChange 이벤트.