below code viewmodel, test.html , test.js:
viewmodel (name of viewmodel testpersonname.js)
define(["knockout"], function (ko) { "use strict"; function personnameviewmodel () { var self = this; self.firstname = ko.observable(); self.lastname = ko.observable(); self.initfullname = function() { return (self.firstname() + " " + self.lastname()); } initfullname(); }; return personnameviewmodel ; });test.html file
<!doctype html> <html> <head> <title>qunit example</title> <link rel="stylesheet" href="qunit-1.18.0.css"> </head> <body> <div id="qunit"></div> <div id="qunit-fixture"></div> <script src="qunit-1.18.0.js"></script> <script type="text/javascript" src="./knockout-3.3.0.js"></script> <script type="text/javascript" src="./jquery-2.1.3.js"></script> <script type="text/javascript" src="./require.js"></script> <!-- source js file --> <script src="testpersonname.js"></script> <!-- test js file --> <script src="./test.js"></script> </body> </html>i have downloaded qunit js/css https://qunitjs.com/
require.js file used https://raw.githubusercontent.com/jrburke/requirejs/dev2.1/require.js
test.js file
test("fullnametest", function () { var model = new personnameviewmodel(); model.firstname("fn"); model.lastname("ln"); equal("fn ln",model.initfullname(), "full name built properly"); });
executing test.html (in chrome) gives following error:
my qunit tests: fullnametest (1, 0, 1)
died on test #1 @ file:///d:/test.js:23:9: personnameviewmodel not defined
source:
referenceerror: personnameviewmodel not defined
@ object. (file:///d:/test.js:24:29)
however, when re-write knockout code (testpersonname.js) below pattern, qunit test passes , works fine.
var personnameviewmodel = function() { "use strict"; var self = this; self.firstname = ko.observable(); self.lastname = ko.observable(); self.initfullname = function() { return (self.firstname() + " " + self.lastname()); }; }; the issue need follow pattern specified @ top testpersonname.js.
you need add main javascript file entry point requirejs.
i put tests main file too. have @ example:
test.html
<!doctype html> <html> <head> <title>qunit example</title> <link rel="stylesheet" href="qunit-1.18.0.css"> </head> <body> <div id="qunit"></div> <div id="qunit-fixture"></div> <script src="qunit-1.18.0.js"></script> <script data-main="test" src="./require.js"></script> </body> </html> test.js
requirejs.config({ baseurl: 'lib', paths: { jquery: './jquery-2.1.3', knockout: './knockout-3.3.0', personnameviewmodel: './testpersonname' } }); define(['jquery', 'knockout', 'personnameviewmodel'], function($, ko, viewmodel){ test("fullnametest", function () { var model = new viewmodel(); model.firstname("fn"); model.lastname("ln"); equal("fn ln",model.initfullname(), "full name built properly"); }); }); i have removed script references knockout, jquery , testpersonname html file. requirejs insert script references when runs.. , test.js entry point test run when requirejs loads, notice data-main attribute on script tag references requirejs.
Comments
Post a Comment