无法通过 Chutzpah 获得简单的 AngularJS Jasmine 测试

Question

我有一个非常简单的 jasmine 单元测试，目标是在 AngularJS 控制器上测试一个简单的操作，如下所示：

/// <reference path="../src/jasmine.js"/>
/// <reference path="../../Scripts/angular.js"/>
/// <reference path="../../Scripts/angular-mocks.js"/>
/// <reference path="../../Scripts/angular-ui-router.js"/>
/// <reference path="../../Scripts/angular-route.js"/>
/// <reference path="../../Scripts/angular-resource.js"/>
/// <reference path="../../Scripts/angular-ui/ui-bootstrap.js"/>
/// <reference path="../../app/app.js"/>
/// <reference path="../../app/controllers/myController.js"/>

describe("my Controller", function () {

   var scope, ctrl, vm;

   beforeEach(module("app"));

   beforeEach(inject(function ($controller, $rootScope) {
      scope = $rootScope.$new();
      ctrl = $controller(MyController, { $scope: scope });
      vm = ctrl;
   }));

   it("sets the title", function() {          
      expect(vm.title).toBe("This is the title");
   });


});

要开始上述测试 passes 使用以下任一方法时：

打开 SpecRunner.html，其中包含相同的引用，并在 jasmine 默认测试运行ner[=52] 中显示 passed 单元测试=]
如果运行通过ReSharper测试运行ner 运行测试通过（这个工具并不重要，除了显示测试通过使用另一个测试运行呃；测试不是罪魁祸首）

然而，无论何时我使用 Chutzpah 执行以下任何操作，测试都会失败：

运行从命令行使用 chutzpah.console.exe
使用VS.NET中打开的右键菜单到运行JS Tests

每次报如下错误：

Error: [$injector:modulerr] Failed to instantiate module app due to: [$injector:nomod] Module 'app' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.

因此，如果 AngularJS 引用 未包含 ，这是一个非常典型的错误。然而，正如您在上面看到的那样，它们肯定包含在内，其他测试运行人员看到它们并且测试通过。无论我运行从命令行进行单元测试还是在 VS.NET.

中查看输出，错误都是相同的

我什至从命令行打开了 /trace 参数并查看了 chutzpah.log 文件。确实找到了 Angular 参考文件，所以我不确定测试失败的原因。

我看过很多关于这个的帖子，解决办法总是缺少参考。这里不是这种情况，我被困住了。我缺少什么才能使用 Chutzpah 使这个测试通过？

Answer 1

我建议对 angular 项目使用 chutzpah.json settings file。我把我的放在项目的根目录下，在 web.config 旁边。您可以通过这种方式在一个地方指定依赖项，这在 angular 项目快速增长时非常有用。我不能确定，但我认为你的看起来像下面这样：

{
  "Framework": "jasmine",
  "FrameworkVersion": "1",
  "References": [
    { "Path": "./Scripts/angular/angular.js" },
    {        
      "Path": "./Scripts/angular",
      "Includes": [ "*.js" ]
    },
    { "Path": "./Scripts/angular-ui/ui-bootstrap.js" },   
    { "Path": "./app/app.js" },
    {        
      "Path": "./app",
      "Includes": [ "*.js" ]
    }                 
  ],
  "Tests": [
    { "Includes": [ "*.spec.js" ] }
  ]
}

这将在 jasmine 版本 1 上运行。我不确定你如何将它包含匹配“./Scripts/angular*.js”的所有内容以及匹配“./app/”的所有内容*.js”（包括子目录）。当您添加新的 angular 引用和应用程序模块时，您不需要修改此配置（一旦您开始工作）。

Answer 2

我相信通过彻底的测试我已经确定了原因。问题很可能是我在测试中使用的 Angular .js 文件中使用了 ES6 类。

问题是 Chutzpah 使用的 PhantomJS 不支持 ES6 和 class 关键字，因此失败（请参阅 this 进行验证）。我能够在非 Angular 样本中重现。我使用了老式的 ES5 风格 IIFE 并且简单的测试现在通过了。这就是它在 Chrome 和 ReSharper 中工作的原因，后者使用 Chrome 作为默认测试浏览器并且 Chrome 支持 ES6 class 关键字。如果我让 ReSharper 使用 PhantomJS 而不是 Chrome，那么我的简单测试也会失败。

根本问题似乎是 PhantomJS 及其不支持 ES6 语法。

这是一个博客 post 我在这上面花费了数周的时间，然后写下了我的发现。它更详细地解释了有关编写非 ES5 投诉代码并将其与 Chutzpah 和 PhantomJS 一起使用的问题：

Chutzpah and non-ES5 JavaScript for Unit Testing is Problematic

无法通过 Chutzpah 获得简单的 AngularJS Jasmine 测试

Cannot get simple AngularJS Jasmine test to pass with Chutzpah

angularjs

visual-studio

unit-testing

jasmine

chutzpah