Angular test $ httpBackend意外请求和正则表达式未定义

Question

我有一个带init函数的简单控制器：

 init() {
    this.PositionService.getPagePosition(this.$state.params.name).then(( res ) => {
      this.position = res.data.position;
    })
  }

我的职位服务：

  getPagePosition( name ) {
    return this.$http.get(this.appConfig.api.positions + '/' + name);
  }

我的测试：

describe('position list page', function() {

  var scope,
      $httpBackend,
      controller;

  beforeEach(module('module'));
  beforeEach(inject(function( $controller, $rootScope, _$httpBackend_, _PositionService_ ) {
    scope = $rootScope.$new();
    $httpBackend = _$httpBackend_;
    controller = $controller('PositionsController', {
      $scope          : scope,
      PositionService : _PositionService_,
    });
  }));

  afterEach(function() {
    $httpBackend.verifyNoOutstandingExpectation();
    $httpBackend.verifyNoOutstandingRequest();
  });

  describe('PositionsController', function() {

    it('should get the position', function() {

      $httpBackend.whenGET(/http:\/\/localhost:3000\/positions\/[a-z]+/).respond(200, {
        data: {
          id: 2
        }
      });

      controller.init();
      $httpBackend.flush();
      expect(controller.position.id).to.equal(1);

    });

  });

});

我的问题是我收到了这个错误：

 Error: Unexpected request: GET http://localhost:3000/api/positions/undefined
    No more request expected

为什么这个参数是不可取的，为什么我会收到这个错误？

Answer 1

使用Jasmine和ES5，测试将如下所示：

＆＃13;

＆＃13;

angular.module('module', [])
  .controller('PositionsController', function(PositionService, $state) {
    this.init = function() {
      PositionService.getPagePosition($state.params.name)
        .then(function(res) {
          this.position = res.data.position;
        }.bind(this))
    }
  }).service('PositionService', function($http, appConfig) {
    this.getPagePosition = function(name) {
      return $http.get(appConfig.api.positions + '/' + name);
    }
  });


describe('Position list page', function() {

  var scope,
    $httpBackend,
    controller;

  beforeEach(module('module'));

  beforeEach(function() {
    angular.module('module').value('appConfig', {
      api: {
        positions: 'http://localhost:3000/positions'
      }
    })
  })

  beforeEach(inject(function($controller, $rootScope, _$httpBackend_, _PositionService_) {
    scope = $rootScope.$new();
    $httpBackend = _$httpBackend_;
    controller = $controller('PositionsController', {
      $scope: scope,
      PositionService: _PositionService_,
      $state: {
        params: {
          name: 'someParamValue'
        }
      }
    });
  }));

  afterEach(function() {
    $httpBackend.verifyNoOutstandingExpectation();
    $httpBackend.verifyNoOutstandingRequest();
  });

  describe('PositionsController:', function() {

    it('Gets the position - init()', function() {
      
      var stubId = 2

      $httpBackend.whenGET(/http:\/\/localhost:3000\/positions\/[a-z]+/).respond(200, {
          position: {
            id: stubId
          }
      });

      controller.init();
      
      expect(controller.position).not.toBeDefined();
      
      $httpBackend.flush();
      
      expect(controller.position).toBeDefined();
      expect(controller.position.id).toEqual(stubId);
    });

  });

});

＆＃13;

<link href="//safjanowski.github.io/jasmine-jsfiddle-pack/pack/jasmine.css" rel="stylesheet" />
<script src="//safjanowski.github.io/jasmine-jsfiddle-pack/pack/jasmine-2.0.3-concated.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular-mocks.js"></script>

＆＃13;

＆＃13;

＆＃13;