[英]Angular Jasmine tests fail with minified source
我将尝试通过一些抽象来解决这个问题,因为深入了解代码细节是没有用的。
我有一个分成 2 个源文件的 angular 模块,比如source1.js
和source2.js
。 然后我有 3 个单元测试文件,它们旨在测试 3 个角度服务/工厂/提供商。
项目布局如下:
root
|
-dist
|
-source.min.js
-src
|
-source1.js
-source2.js
-tests
|
-unit
|
-service1.js
-service2.js
-service3.js
所有测试,使用 karma 和 jasmine 运行,按预期通过并工作。 看到这一点业力配置来理解这一点:
files: [
'bower_components/angular/angular.min.js',
'bower_components/angular-mocks/angular-mocks.js',
'src/*.js',
'tests/unit/*.js'
],
接下来,我使用gulpjs
将source.min.js
和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'
],
使用此配置,由于角度依赖注入,所有测试都失败了 - 看起来提供者没有得到解决。
什么可能导致这种情况? 我的意思是,源代码应该是相同的。
这是角度、依赖注入和缩小的已知问题。 此外,问题恰恰在于代码的细节。
情况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 每次都将无法在缩小时工作,因为服务的名称会改变,而 angular 将无法仅通过查看名称来推断 a、b 或 c 所指的服务。
但是,Case 2 每次都会起作用,因为 angular 不必猜测,因为 $inject 告诉它 service1 是 a 而 service 2 是 b 等等。
如果您使用像 Gulp 这样的构建实用程序,您可以使用ng-annotate ,它会在案例 1 中自动为您注入依赖项,您的代码应该仍然可以工作。
在我个人看来,作为一个风格问题,你应该使用案例 2。我倾向于遵循John Papa 的 Angular 风格指南
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.