为什么在使用带有Angular的Jasmine时会出现'注入'未定义的错误?

时间:2013-04-11 19:27:18

标签: angularjs jasmine

我是Jasmine / AngularJS单元测试新手。我创建了一个简单的角度应用程序来添加两个数字,以便我可以学习如何为Angular App编写单元测试。 Angular Doc on unit test is incomplete。基于博客和堆栈溢出答案,我构建了我的第一个测试,我遇到了'injector'未定义的错误。我正在使用Jasmine框架进行单元测试。
HTML

<body>
<div ng-controller="additionCtrl">
    First Number: <input ng-model="NumberOne"/><br/>
    Second Number: <input ng-model="NumberTwo"/>
    <button ng-click="add(NumberOne, NumberTwo)">Add</button><br/>
    Result: {{Result}}
</div>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.1/angular.min.js"></script>
<script src="Scripts/additionCtrl.js"></script>
</body>

控制器:

function additionCtrl($scope) {
$scope.NumberOne = 0;
$scope.NumberTwo = 0;
$scope.Result = 0;
$scope.add = function (a, b) {
};
}

Jasmine规范文件。

describe("Addition", function () {
var $scope, ctrl;

beforeEach(inject(function ($rootScope, $controller) {
    this.scope = $rootScope.$new();
    ctrl = $controller('additionCtrl', {
       $scope: this.scope 
    });
}));

it("should add two integer numbers.", inject(function ($controller) {        
    expect(ctrl.add(2, 3)).toEqual(5);
}));
});

Specrunner.html

    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.1/angular.min.js"></script>
  <script type="text/javascript" src="lib/angular-mocks.js"></script>
  <script type="text/javascript" src="lib/jasmine-1.3.1/jasmine.js"></script>
  <script type="text/javascript" src="lib/jasmine-1.3.1/jasmine-html.js"></script>

  <!-- include source files here... -->
  <script type="text/javascript" src="../App/Scripts/additionCtrl.js"></script>

  <!-- include spec files here... -->
  <script type="text/javascript" src="spec/addition.spec.js"></script>  

这是一个失败的测试,一旦测试失败并带有预期的结果,那么我可以修改代码使其通过,但我面临的问题是某种角度模拟没有得到注入器。
我看到一个例子,我可以用新的控制器而不是使用注射器,但我想尝试学习使用注射器,以便我设置更复杂的测试。
我可能会在这里找不到简单的东西。请指导我可能错过的任何写作 感谢

2 个答案:

答案 0 :(得分:11)

发现问题,我用来访问angular-mock的网址是错误的。我将其更改为“http://code.angularjs.org/1.0.6/angular-mocks.js”,并将脚本标记的顺序更改为

<script type="text/javascript" src="lib/jasmine-1.3.1/jasmine.js"></script>
<script type="text/javascript" src="lib/jasmine-1.3.1/jasmine-html.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.1/angular.min.js"></script>
<script type="text/javascript" src="http://code.angularjs.org/1.0.6/angular-mocks.js"></script>

现在它失败了,因为它应该是。

答案 1 :(得分:11)

为了将来参考,这是一个带有完整单元测试设置的Plunker(对于我即将发布的问题的答案)

http://plnkr.co/edit/KZGKM6

将此设置用于共享测试方案非常有用。