Question

我会尝试用一点点抽象来处理这个问题，因为进入代码细节会没用。

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

项目布局如下：

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

所有的测试，与业力和茉莉一起运行，通过并按预期工作。看到这一点的业力配置得到了重点：

files: [

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

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

接下来，我将source1和source2与gulpjs缩小为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'
],

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

是什么导致这个？我的意思是，源代码应该是相同的。

Answer 1

这是角度，依赖注入和缩小的已知问题。此外，问题恰恰在于代码的细节。

案例1：

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

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

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

案例2：

使用显式注入，angular使用控制器函数参数按照它们的注入顺序。

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

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

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

案例1在每次缩小时都无法工作，因为服务名称会发生变化，而角度将无法通过查看其名称来推断出a或b或c所引用的服务。

然而，案例2每次都会起作用，因为角度不必猜测，因为$ inject告诉service1是a，服务2是b等等。

如果您正在使用像Gulp这样的构建实用程序，则可以使用ng-annotate，它将在案例1中自动为您注入依赖项，并且您的代码仍然有效。

在我看来，作为一种风格，你应该使用案例2.我倾向于遵循John Papa's Angular Style Guide

附近的内容

Angular Jasmine测试失败，缩小了源

1 个答案: