服务注入测试控制器jasmin

时间:2014-01-22 23:08:37

标签: angularjs unit-testing jasmine

最新更新

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

'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']);

我对角js很新。我正在尝试编写一个测试我的RootCtrl的jasmin规范。

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

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

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

RootCtrl的函数有一个'Data'参数,因此scope对象可以访问$ resource提取的共享data.json。

我将其设置为Root 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 doc说它与$ http服务一起使用,但我使用的是资源。

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

感谢任何帮助。

2 个答案:

答案 0 :(得分:0)

当您运行beforeEach(module("backpageApp")); angular-mocks会自动加载所有依赖项并允许您像常规应用程序一样注入它们( not tests

您还需要使用$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}); 
}));

答案 1 :(得分:0)

我想通了我应该使用来自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(); 

用于测试目的