服务注入测试控制器 jasmin答案

【问题标题】：Service Injection to test controller jasmin服务注入测试控制器 jasmin
【发布时间】：2014-01-22 23:08:36
【问题描述】：

最新更新

仍然找不到我的服务或工厂。

'use strict';

/* jasmine specs for controllers go here */

describe("Backpage Controller", function(){

   describe('Root Ctrl', function() {

    var scope, ctrl, myService; 

    beforeEach(module("backpageApp")); 

    beforeEach(inject(function(Data, $controller, $rootScope) {
      myService = Data; 
      scope = $rootScope.$new(); 
      ctrl = $controller("RootCtrl", {$scope:scope}); 
    }));

   it('should set the default value of orderProp model', function() {
      expect(scope.orderProp).toBe('rent')
   });

   it('should create "listings" model with 10 listings', function() {
      expect(myService.listings.length).toBe(10)
   });

  });
});

这是最新的错误。

Chrome 32.0.1700 (Mac OS X 10.8.4) Backpage Controller Root Ctrl should create "listings" model with 10 listings FAILED
    TypeError: Cannot read property 'length' of undefined
        at null.<anonymous> (/Users/judyngai/Desktop/Jan2014/newback/trynewversion/minibackpage/test/unit/controllersSpec.js:24:32)
Chrome 32.0.1700 (Mac OS X 10.8.4): Executed 2 of 2 (1 FAILED) (0.284 secs / 0.058 secs)

我的 services.js 文件包含这个，我正在使用 angular 种子项目。

angular.module('backpage.services', [])
  .factory('Data', function($resource) {
    return $resource('data/data.json');
});

我的 app.js 文件是这个

var backpageApp = angular.module('backpageApp', ['ui.router', 'ngResource', 'ngRoute','backpage.services', 'backpagecontrollers']);

我对 Angular js 很陌生。我正在尝试编写一个测试我的 RootCtrl 的 jasmin 规范。

我创建了一个在控制器之间共享的服务

angular.module('backpage.services', [])
  .factory('Data', function($resource) {
    return $resource('data/data.json');
});

我将上面的模块注入到我的应用程序级模块中。

RootCtrl 为其函数提供了一个“数据”参数，因此范围对象可以访问由 $resource 获取的共享 data.json。

我将此设置为根 Ctrl 中的数据

$scope.listings = Data.query();

现在我无法弄清楚如何将我创建的服务注入到我用 jasmin 编写的规范中。

我的 Jasmin 文件目前看起来像这样

describe("Backpage Controller", function(){

   describe('Root Ctrl', function() {

    var scope, ctrl; 

    beforeEach(module("backpageApp")); 

    var $injector = angular.injector(['backpageApp']); 
    var myService = $injector.get('backpage.services');

    beforeEach(inject(function($controller, $httpBackend) {
      scope = {}; 
      ctrl = $controller("RootCtrl", {$scope:scope}); 
    }));

   it('should set the default value of orderProp model', function() {
      expect(scope.orderProp).toBe('rent')
   });

   it('should create "listings" model with 10 listings', function() {
      expect(myService.listings.length).toBe(10)
   });

  });
});

我目前在运行 jasmin 测试时遇到此错误

Chrome 32.0.1700 (Mac OS X 10.8.4) Backpage Controller Root Ctrl encountered a declaration exception FAILED
    Error: [$injector:unpr] Unknown provider: backpage.servicesProvider <- backpage.services

我看过angular js官方文档上的测试示例，示例使用

$httpBackend

在 jasmin 代码中获取 json 文件，但 $httpBackend 文档说它与 $http 服务一起使用，但我正在使用资源。

data.json 还包含 10 个广告列表。

感谢任何帮助。

【问题讨论】：

标签： angularjs unit-testing jasmine

【解决方案1】：

当您运行beforeEach(module("backpageApp")); angular-mocks 时会自动加载所有依赖项并允许您像在常规应用程序中一样注入它们（不是测试）

您还需要使用$rootScope 创建一个范围：

var scope, ctrl, myService; 


beforeEach(module("backpageApp")); 


beforeEach(inject(function(Data, $controller, $httpBackend, $rootScope) {
  myService = Data;
  scope = $rootScope.$new(); 
  ctrl = $controller("RootCtrl", {$scope:scope}); 
}));

【讨论】：

我收到了这个TypeError: Cannot read property 'length' of undefined at null.
我现在收到这个新错误TypeError: Object #<Scope> has no method 'new' 我也更新了我的答案。
我认为myService 仍然未定义。
未定义是什么意思？是注入还是抛出提供者错误？

【解决方案2】：

我发现我应该只使用 Angular js 中的 $httpBackend 来获取 data.json 文件。

我有这个变量httpBackend

我将它注入到 $httpBackend

 httpBackend.when('GET', 'data/data.json').respond([{id: 1 }, {id: 2}, {id:3}, {id:4}, {id:5}, {id:6}, {id:7}, {id:8}, {id:9}, {id:10}]);

然后将其冲洗干净

 httpBackend.flush();

用于测试目的

【讨论】：