Javascript 具有多相关性的角度控制器测试

Javascript 具有多相关性的角度控制器测试,javascript,angularjs,Javascript,Angularjs,我正在通过构建一个小型房地产应用程序来学习AngularJS。由于我是AngularJS的新手,我对具有许多依赖项的控制器测试知之甚少。我在谷歌上搜索了一下,但找到的信息很少。任何帮助都将不胜感激 以下测试失败: it('should create "proterties" model with 1 property fetched from xhr', function() { $httpBackend.flush(); scope.properties = scope.getResu

我正在通过构建一个小型房地产应用程序来学习AngularJS。由于我是AngularJS的新手,我对具有许多依赖项的控制器测试知之甚少。我在谷歌上搜索了一下,但找到的信息很少。任何帮助都将不胜感激

以下测试失败:

it('should create "proterties" model with 1 property fetched from xhr', function() {
  $httpBackend.flush();
  scope.properties = scope.getResultsPage(1);

  expect(scope.properties).toEqual(propertiesData());
});
controllerspecs.js:

'use strict';

/* jasmine specs for controllers go here */
describe('Realty controllers', function() {

  beforeEach(module('realtyApp'));
  beforeEach(module('angularUtils.directives.dirPagination'));
  beforeEach(module('realtyFilters'));
  beforeEach(module('realtyServices'));


  describe('PropertyListCtrl', function(){
    var scope, ctrl, $httpBackend;

    function propertiesData() {
      return {
        "total": 1,
        "data":[{
          "id": "26",
          "property_type": "apartment",
          "amount": "600",
          "address": "26 Marsh St, Wolli Creek",
        }]
      }
    };

    // Learn more about dependency injection for testing
    // https://docs.angularjs.org/tutorial/step_05
    beforeEach(inject(function(_$httpBackend_, $rootScope, $controller) {

      $httpBackend = _$httpBackend_;
      $httpBackend.expectGET('/api/properties?page=1').
          respond(propertiesData());

      scope = $rootScope.$new();
      ctrl = $controller('PropertyListCtrl', {$scope: scope});
    }));


    it('should create "proterties" model with 1 property fetched from xhr', function() {
      $httpBackend.flush();
      scope.properties = scope.getResultsPage(1);


      // scope.properties = propertiesData();
      expect(scope.properties).toEqual(propertiesData());
    });
  });
});
'use strict';

/* App Module */

var realtyApp = angular.module('realtyApp', [
  'ngRoute',
  'angularUtils.directives.dirPagination',
  'realtyControllers',
  'realtyFilters',
  'realtyServices'
]);
主应用程序模块:

'use strict';

/* jasmine specs for controllers go here */
describe('Realty controllers', function() {

  beforeEach(module('realtyApp'));
  beforeEach(module('angularUtils.directives.dirPagination'));
  beforeEach(module('realtyFilters'));
  beforeEach(module('realtyServices'));


  describe('PropertyListCtrl', function(){
    var scope, ctrl, $httpBackend;

    function propertiesData() {
      return {
        "total": 1,
        "data":[{
          "id": "26",
          "property_type": "apartment",
          "amount": "600",
          "address": "26 Marsh St, Wolli Creek",
        }]
      }
    };

    // Learn more about dependency injection for testing
    // https://docs.angularjs.org/tutorial/step_05
    beforeEach(inject(function(_$httpBackend_, $rootScope, $controller) {

      $httpBackend = _$httpBackend_;
      $httpBackend.expectGET('/api/properties?page=1').
          respond(propertiesData());

      scope = $rootScope.$new();
      ctrl = $controller('PropertyListCtrl', {$scope: scope});
    }));


    it('should create "proterties" model with 1 property fetched from xhr', function() {
      $httpBackend.flush();
      scope.properties = scope.getResultsPage(1);


      // scope.properties = propertiesData();
      expect(scope.properties).toEqual(propertiesData());
    });
  });
});
'use strict';

/* App Module */

var realtyApp = angular.module('realtyApp', [
  'ngRoute',
  'angularUtils.directives.dirPagination',
  'realtyControllers',
  'realtyFilters',
  'realtyServices'
]);
属性列表控制器

'use strict';

/* Controllers */

var realtyControllers = angular.module('realtyControllers', []);

realtyControllers.controller('PropertyListCtrl', ['$scope', 'Property', 'propertyImage', 'propertyData',
  function($scope, Property, propertyImage, propertyData) {
    $scope.beds = propertyData.beds();
    $scope.bathrooms = propertyData.bathrooms();
    $scope.garageSpaces = propertyData.garageSpaces();

    // Paginate properties
    $scope.totalProperties = 0;
    $scope.propertiesPerPage = 10; // this should match however many results your API puts on one page


    $scope.pagination = {
        current: 1
    };



    $scope.getResultsPage = function getResultsPage(pageNumber) {
      // The following will generate : 
      // http://realty.dev/api/properties?page=1
      Property.get({page:pageNumber}, function(result) {
        $scope.properties = result.data;
        $scope.totalProperties = result.total;
      });
    }

    $scope.getResultsPage(1);

    $scope.pageChanged = function(newPage) {
        $scope.getResultsPage(newPage);
    };

    $scope.isCarSpaceAvailable = function(carSpace) {
      if (carSpace != 0) {
        return true;
      }
      return false;
    }

    $scope.getPropertyImage = function(photo) {
      return propertyImage.jpg(photo.name);
    }

    $scope.clearFilters = function() {
      $scope.filter = {};
    }        
  }]);
编辑1:

'use strict';

/* jasmine specs for controllers go here */
describe('Realty controllers', function() {

  beforeEach(module('realtyApp'));
  beforeEach(module('angularUtils.directives.dirPagination'));
  beforeEach(module('realtyFilters'));
  beforeEach(module('realtyServices'));


  describe('PropertyListCtrl', function(){
    var scope, ctrl, $httpBackend;

    function propertiesData() {
      return {
        "total": 1,
        "data":[{
          "id": "26",
          "property_type": "apartment",
          "amount": "600",
          "address": "26 Marsh St, Wolli Creek",
        }]
      }
    };

    // Learn more about dependency injection for testing
    // https://docs.angularjs.org/tutorial/step_05
    beforeEach(inject(function(_$httpBackend_, $rootScope, $controller) {

      $httpBackend = _$httpBackend_;
      $httpBackend.expectGET('/api/properties?page=1').
          respond(propertiesData());

      scope = $rootScope.$new();
      ctrl = $controller('PropertyListCtrl', {$scope: scope});
    }));


    it('should create "proterties" model with 1 property fetched from xhr', function() {
      $httpBackend.flush();
      scope.properties = scope.getResultsPage(1);


      // scope.properties = propertiesData();
      expect(scope.properties).toEqual(propertiesData());
    });
  });
});
'use strict';

/* App Module */

var realtyApp = angular.module('realtyApp', [
  'ngRoute',
  'angularUtils.directives.dirPagination',
  'realtyControllers',
  'realtyFilters',
  'realtyServices'
]);
我得到以下错误:

当你这样做的时候 scope.properties=scope.getResultsPage(1)

您将属性影响到从getResultsPage返回的内容,而该函数不会返回任何内容

您可以试试(我认为应该在方法之后调用flush):


你的错误是什么?@BorisCharpentier我已经添加了屏幕截图。我试过了,但仍然不起作用。现在得到这个错误: