Angular Jasmine 测试因源代码缩小而失败

我将尝试用一点抽象来解决这个问题，因为深入代码细节是没有用的。

我有一个角度模块，分为 2 个源文件，例如source1.js and source2.js。然后我有 3 个单元测试文件，旨在测试 3 个角度服务/工厂/提供商。

项目布局如下：

root
|
-dist
   |
   -source.min.js
-src
   |
   -source1.js
   -source2.js
-tests
   |
   -unit
      |
      -service1.js
      -service2.js
      -service3.js

所有测试都通过 karma 和 jasmine 运行，并按预期工作。请参阅这段 karma 配置以了解要点：

files: [

  'bower_components/angular/angular.min.js',
  'bower_components/angular-mocks/angular-mocks.js',

  'src/*.js',
  'tests/unit/*.js'
],

接下来我缩小了source1和source2gulpjs into source.min.js并尝试使用缩小的文件运行测试，所以我更改了 karma 配置如下：

files: [

  'bower_components/angular/angular.min.js',
  'bower_components/angular-mocks/angular-mocks.js',

  'dist/*.js', // <--- see here.
  'tests/unit/*.js'
],

使用此配置，由于角度依赖注入，所有测试都会失败 - 看起来提供程序没有被解析。

什么可能导致这种情况？我的意思是，源代码应该是相同的。

这是角度、依赖注入和缩小的一个已知问题。而且，问题恰恰出在代码的细节上。

Case 1:

如果没有显式注入，当使用声明的函数作为控制器时，Angular 会尝试从服务名称推断服务。

angular.module('app').controller('MyController', MyController);

function MyController(service1, service2, ...){ ... service1.doSomething ...}

Case 2:

通过显式注入，Angular 按照注入的顺序使用控制器函数参数。

angular.module('app').controller('MyController', MyController);

MyController.$inject = ['service1', 'service2', ...]

function MyController(a, b, ...){ ... a.doSomething ... }

情况 1 每次缩小都会失败，因为服务的名称会改变，并且 Angular 将无法仅通过查看名称来推断 a、b 或 c 所引用的服务。

然而，情况 2 每次都会起作用，因为 Angular 不必猜测，因为 $inject 告诉它 service1 是 a，service 2 是 b 等等。

如果您正在使用像 Gulp 这样的构建实用程序，您可以使用ng-注释 https://www.npmjs.com/package/gulp-ng-annotate在情况 1 中，它将自动为您注入依赖项，并且您的代码应该仍然可以工作。

在我看来，从风格上来说，你应该使用案例 2。我倾向于遵循与John Papa 的 Angular 风格指南 https://github.com/johnpapa/angular-styleguide