Question

以下是我的ViewModel，test.html和test.js的代码：

Viewmodel（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文件

<!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中）会出现以下错误：

我的QUnit测试：FullNameTest（1,0,1）

死于测试＃1的文件：/// D：/Test.js：23：9：PersonNameViewModel未定义
  来源：
    ReferenceError：未定义PersonNameViewModel
    在对象。（文件：/// 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顶部指定的模式。

Answer 1

您需要添加主 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加载时运行，请注意脚本标记上引用requirejs的data-main属性。

Answer 2

@Anish感谢您的回复非常有帮助。但是，我正在使用命令行中的phatomjs运行我的测试用例，并且在执行时面临不一致。有时只会识别并执行测试用例，否则大多数情况下会说0测试成功。＃34; 我的最终目标是使用ant build自动化这些。

我正在使用以下phatomjs命令行运行程序实用程序： https://github.com/leedavidr/qunit/blob/master/addons/phantomjs/runner.js

敲除js失败的QUnit测试：＆＃34; ReferenceError：ViewModel未定义＆＃34;

2 个答案: