Angular Jasmine测试因源缩小而失败

Angular Jasmine tests fail with minified source

本文关键字：缩小 失败 Jasmine 测试 Angular      更新时间：2023-09-26

我将尝试用一点抽象来处理这个问题，因为深入了解代码细节是无用的。

我有一个角度模块，它分为两个源文件，比如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'
],

接下来，我用gulpjs将source1和source2缩小为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所指的服务。

然而，情况2每次都会起作用，因为angular不必猜测，因为$inject告诉它服务1是a，服务2是b，依此类推

如果你使用像Gulp这样的构建实用程序，你可以使用ng注释，它将在案例1中自动为你注入依赖项，你的代码应该仍然可以工作。

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

相关文章：