html 출력 테스트 (정의되지 않음)

기본 테스트 프레임 워크를 작성했으며 바닐라 자바 스크립트에서 단일 페이지 응용 프로그램을 만들지 않습니다.html 출력 테스트 (정의되지 않음)

필자는 내 뷰 테스트에서 '목록'생성자를 실행할 때이를 인식하지 못하는 이유를 알아 내려고 노력했습니다.

내 specrunner에로드 된 모든 파일이 있고 내 모델에 대한 이전 테스트가 정상적으로 작동합니다. 또한 Specrunner의 브라우저 콘솔을 사용하여 테스트를 모방하면 정확한 결과도 얻을 수 있습니다.

내 repo를 복제하는 것이 더 빠르면 무료입니다. here.

내 테스트 프레임 워크 "에스프레소"는 assert 대신 expect를 사용하고 테스트 설명에 대한 추가 매개 변수가 있음에 유의하십시오.

espresso.js

var describe = function(description, test) { 
    document.getElementById("output").innerHTML += 
    "<br><b>" + description + "</b></br>"; 
    try { 
    test(); 
    } catch (err) { 
    document.getElementById("output").innerHTML += 
     "<br><li>error: " + err.message + "</li></br>"; 
    console.log(err); 
    } 
}; 

var expect = { 
    isEqual: function(description, first, second) { 
    if (first === second) { 
     document.getElementById("output").innerHTML += 
     description + 
     "<br><li><font color='green'>PASS: [" + 
     first + 
     "] is equal to [" + 
     second + 
     "]</li></br>"; 
    } else { 
     document.getElementById("output").innerHTML += 
     "<br><li><font color='red'>FAIL: [" + 
     first + 
     "] is not equal to [" + 
     second + 
     "]</li></br>"; 
    } 
    } 
}

Specrunner.html

<!DOCTYPE html> 
<html> 
    <head> 
    <meta charset="utf-8"> 
    <title>Expresso Spec Runner</title> 
    </head> 
    <body> 
    <h1><u>Expresso Spec Runner</u></h1> 
    <br> 
    <div id="output"></div> 
    <script src="expresso/expresso.js"></script> 

    <!-- include source files here... --> 
    <script src="lib/list-model.js"></script> 
    <script src="lib/note-model.js"></script> 
    <script src="lib/list-view.js"></script> 

    <!-- include spec files here... --> 
    <script src="tests/expresso-test.js"></script> 
    <script src="tests/model-tests.js"></script> 
    <script src="tests/view-tests.js"></script> 
    </body> 
</html>

리스트 model.js

(function(exports) { 
    "use strict"; 

    function List() { 
    this.notelist = []; 
    } 

    List.prototype.add = function(text) { 
    let note = new Note(text); 
    this.notelist.push(note); 
    }; 

    exports.List = List; 
})(this); 

// note-model.js 

(function(exports) { 
    "use strict"; 

    function Note(text) { 
    this.text = text; 
    } 

    Note.prototype.show = function() { 
    return this.text; 
    }; 

    exports.Note = Note; 
})(this);

리스트 view.js

(function(exports) { 
    "use strict"; 

    function View() { 
    this.test = "hello there"; 

    View.prototype.convert = function(note) { 
     var output = []; 
     list.notelist.forEach(function(element) { 
     output.push("<br><ul>" + element.text + "</ul></br>"); 
     }); 
     console.log(output); 
     return output; 
    }; 
    } 

    exports.View = View; 
})(this);

모델 test.js

describe("List #initialize", function() { 
    var list = new List(); 
    expect.isEqual("blank array is loaded", list.notelist.length, 0); 
}); 

describe("List #add", function() { 
    var list = new List(); 
    list.add("hello"); 
    expect.isEqual(
    "can create and store a note", 
    list.notelist[0].show(), 
    "hello" 
); 
    list.add("goodbye"); 
    expect.isEqual(
    "second note says goodbye", 
    list.notelist[1].show(), 
    "goodbye" 
); 
    expect.isEqual("there are two notes in the list", list.notelist.length, 2); 
});

조회 tests.js (고장난 시험) 미리

describe("View #convert", function() { 
    var view = new View(); 
    expect.isEqual(
    "converts the note into a HTML list", 
    view.convert(list.notelist), 
    "<br><ul>hello</ul></br>" 
); 
});

감사합니다.

출처

2017-12-17 pyan

view-test.js에 list을 정의해야합니다.

describe("View #convert", function() { 
    var list = new List(); 
    // ... 
});

당신은 다음 인수로에 통과해야 하나,이 테스트 기능의 list 외부를 정의하거나 전 세계적으로 액세스 할 수 있도록 window 객체를 정의해야합니다.

출처

2017-12-17 21:31:13

html 출력 테스트 (정의되지 않음)

답변

관련 문제