下面是我的 ViewModel、test.html 和 test.js 的代码:
Viewmodel( View 模型的名称是 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 文件
<!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>
我已经从https://qunitjs.com/下载了QUnit js/css
Require.js 文件使用于 https://raw.githubusercontent.com/jrburke/requirejs/dev2.1/require.js
Test.js 文件
test("FullNameTest", function () { var model = new PersonNameViewModel(); model.firstName("fn"); model.lastName("ln"); equal("fn ln",model.initFullName(), "full name built properly"); });
执行 Test.html(在 Chrome 中)出现以下错误:
My QUnit Tests: FullNameTest (1, 0, 1)
Died on test #1 at file:///D:/Test.js:23:9: PersonNameViewModel is not defined
Source:
ReferenceError: PersonNameViewModel is not defined
at Object. (file:///D:/Test.js:24:29)
但是,当我将 Knockout 代码 (TestPersonName.js
) 重写为以下模式时,QUnit 测试通过并且工作得很好。
var PersonNameViewModel = function() {
"use strict";
var self = this;
self.firstName = ko.observable();
self.lastName = ko.observable();
self.initFullName = function() {
return (self.firstName() + " " + self.lastName());
};
};
问题是我需要遵循顶部为 TestPersonName.js
指定的模式。
最佳答案
您需要添加一个 main javascript 文件作为 requirejs 的入口点。
我也会将我的测试放入这个main文件中。看看这个例子:
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");
});
});
我已经从 html 文件中删除了对 Knockout、jquery 和 TestPersonName 的脚本引用。 Requirejs 会在运行时为您插入脚本引用。test.js
将是此测试的入口点,它将在 requirejs 加载时运行,请注意 data-main
> 引用 requirejs 的 script 标签上的属性。
关于javascript - QUnit knockout js 测试失败 : "ReferenceError: ViewModel is not defined",我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31428902/