AngularJs 控制器测试：意外请求：GET答案

【问题标题】：AngularJs controller test: unexpected request : GETAngularJs 控制器测试：意外请求：GET
【发布时间】：2015-03-29 22:34:57
【问题描述】：

我正在尝试通过使用 karma-jasmine 和 httpBackend 模拟服务层来编写我的第一个控制器测试。但是我收到了这个错误。

错误：意外请求：GET./webresources/campaign/getCampaignDetails/undefined 预期 GET ./webresources/campaign/getCampaignDetails/CMP1000004568

提前感谢您的帮助:)

服务：

    (function() {
    'use strict';

    angular.module('tbApp').factory('Campaign', CampaignFactory);

    CampaignFactory.inject = ['$http'];


    function CampaignFactory($http) {

        //base url for all rest service calls
        var baseUrl = WS_PATH + '/webresources/campaign';

        var Campaign = {

            getCampaignDetails: getCampaignDetails,

        };

        return Campaign;

        function getCampaignDetails(campaignId) {
            return $http.get(baseUrl + '/getCampaignDetails/' + campaignId).then(getCampaignDetailsComplete);

            function getCampaignDetailsComplete(response) {
                return response.data;
            }
        }

         }
})();

控制器：

(function () {
'use strict';

angular.module('tbApp').controller('campaignEditCtrl', campaignEditCtrl);


campaignEditCtrl.inject = ['$routeParams', 'Campaign', 'User', '$location', 'Asset', '$window', '$scope', '$compile', 'ImageLibrary', 'Lists'];

function campaignEditCtrl($routeParams, Campaign, User, $location, Asset, $window, $scope, $compile, ImageLibrary, Lists) {


    var vm = this;

    vm.campaignData = [];
    vm.getCampaignDetails = getCampaignDetails;


    initialise();

    /**
     * Initialises the campaign properties page         
     */
    function initialise() {
        // Registes a click listener to hide action menu
        $window.addEventListener('click', function (event) {
            if (event.which !== 3) {
                $scope.$apply(function () {
                    vm.selectedActionItem = '';
                });
            }
        });
         fromPage=true;
         fromPage1=true;

        vm.user = User.info;
        vm.campaignId = $routeParams.campId;
        //set default value to prevent filter error
        vm.campaignData.imageName = '///////';
        getCampaignDetails();
        getAllImageData();
    }

    /**
     * Load the campaign details         
     */
    function getCampaignDetails() {
        vm.loadingCampaignDetails = true;
        Campaign.getCampaignDetails(vm.campaignId).then(getCampaignDetailsComplete);

        function getCampaignDetailsComplete(data) {

            vm.campaignData = data;                

        }
    }

     }})();

控制器规格：

    describe('campaignEditCtrl as vm', function() {
    var scope, httpBackend,  controller,  vm, createController, campaignId;

    var baseUrl = './webresources/campaign';

     beforeEach(module("tbApp"));
    beforeEach(inject(function($rootScope, $httpBackend, $controller) {
        httpBackend = $httpBackend;

        scope = $rootScope.$new();
        controller = $controller;
        campaignId= "CMP1000004568";
        //service = Campaign;
        createController = function() {
            return $controller('campaignEditCtrl', {
                '$scope': scope
            });
        };

        httpBackend.when("GET", baseUrl+"/getCampaignDetails/"+campaignId).respond([{}, {}, {}]);


    }));

  /*afterEach(function() {
        httpBackend.verifyNoOutstandingExpectation();
        httpBackend.verifyNoOutstandingRequest();
    });*/


    it('should run the Test to get the campaign data from the backend', function() {
        console.log("here"+campaignId);
        vm=createController();
        httpBackend.expectGET(baseUrl+"/getCampaignDetails/"+campaignId);

        scope.$apply(function() {
            scope.runTest();
        });

        //expect(vm.campaignData.imageName).toEqual('///////');

        httpBackend.flush();

        expect(vm.campaignData.length).toBe(3);


    });
});

输出：

    INFO [karma]: Karma v0.12.31 server started at http://localhost:9876/
INFO [launcher]: Starting browser Chrome
INFO [launcher]: Starting browser PhantomJS
INFO [PhantomJS 1.9.8 (Windows 7)]: Connected on socket jAWt7tfOMUkrmCjM0d_n with id 71764124
INFO [Chrome 41.0.2272 (Windows 7)]: Connected on socket Fu0mS3U91St4gSQ10d_o with id 78282639
WARN [web-server]: 404: /webresources/user/checkSession
PhantomJS 1.9.8 (Windows 7) LOG: 'WARNING: Tried to load angular more than once.'

LOG: 'hereCMP1000004568'
PhantomJS 1.9.8 (Windows 7) campaignEditCtrl as vm should run the Test to get the campaign data from the backend FAILED
        Error: Unexpected request: GET ./webresources/campaign/getCampaignDetails/undefined
        Expected GET ./webresources/campaign/getCampaignDetails/CMP1000004568
            at $httpBackend (D:/Tb_test/Campaign_Builder_Maven/campaign-builder-webapp/src/main/webapp/angular-mocks.js:1181)
            at sendReq (D:/Tb_test/Campaign_Builder_Maven/campaign-builder-webapp/src/main/webapp/js/libraries/uncompressed/angular.js:8404)
            at D:/Tb_test/Campaign_Builder_Maven/campaign-builder-webapp/src/main/webapp/js/libraries/uncompressed/angular.js:8123
            at D:/Tb_test/Campaign_Builder_Maven/campaign-builder-webapp/src/main/webapp/js/libraries/uncompressed/angular.js:11659
            at D:/Tb_test/Campaign_Builder_Maven/campaign-builder-webapp/src/main/webapp/js/libraries/uncompressed/angular.js:11659
            at D:/Tb_test/Campaign_Builder_Maven/campaign-builder-webapp/src/main/webapp/js/libraries/uncompressed/angular.js:11745
            at D:/Tb_test/Campaign_Builder_Maven/campaign-builder-webapp/src/main/webapp/js/libraries/uncompressed/angular.js:12788
            at D:/Tb_test/Campaign_Builder_Maven/campaign-builder-webapp/src/main/webapp/js/libraries/uncompressed/angular.js:12600
            at D:/Tb_test/Campaign_Builder_Maven/campaign-builder-webapp/src/main/webapp/js/libraries/uncompressed/angular.js:12892
            at D:/Tb_test/Campaign_Builder_Maven/campaign-builder-webapp/src/test/js/campaignEditSpec.js:42
            at D:/Tb_test/Campaign_Builder_Maven/campaign-builder-webapp/node_modules/karma-jasmine/lib/boot.js:117
            at D:/Tb_test/Campaign_Builder_Maven/campaign-builder-webapp/node_modules/karma-jasmine/lib/adapter.js:171
            at http://localhost:9876/karma.js:185
            at http://localhost:9876/context.html:157
PhantomJS 1.9.8 (Windows 7): Executed 2 of 2 (1 FAILED) (0.008 secs / 0.024 secs)
LOG: 'WARNING: Tried to load angular more than once.'
Chrome 41.0.2272 (Windows 7) LOG: 'hereCMP1000004568'
Chrome 41.0.2272 (Windows 7) campaignEditCtrl as vm should run the Test to get the campaign data from the backend FAILED
        Error: Unexpected request: GET ./webresources/campaign/getCampaignDetails/undefined
        Expected GET ./webresources/campaign/getCampaignDetails/CMP1000004568
            at $httpBackend (D:/Tb_test/Campaign_Builder_Maven/campaign-builder-webapp/src/main/webapp/angular-mocks.js:1180:9)
            at sendReq (D:/Tb_test/Campaign_Builder_Maven/campaign-builder-webapp/src/main/webapp/js/libraries/uncompressed/angular.js:8403:9)
            at serverRequest (D:/Tb_test/Campaign_Builder_Maven/campaign-builder-webapp/src/main/webapp/js/libraries/uncompressed/angular.js:8123:16)
            at wrappedCallback (D:/Tb_test/Campaign_Builder_Maven/campaign-builder-webapp/src/main/webapp/js/libraries/uncompressed/angular.js:11659:8
            at wrappedCallback (D:/Tb_test/Campaign_Builder_Maven/campaign-builder-webapp/src/main/webapp/js/libraries/uncompressed/angular.js:11659:8
            at D:/Tb_test/Campaign_Builder_Maven/campaign-builder-webapp/src/main/webapp/js/libraries/uncompressed/angular.js:11745:26
            at Scope.$eval (D:/Tb_test/Campaign_Builder_Maven/campaign-builder-webapp/src/main/webapp/js/libraries/uncompressed/angular.js:12788:28)
            at Scope.$digest (D:/Tb_test/Campaign_Builder_Maven/campaign-builder-webapp/src/main/webapp/js/libraries/uncompressed/angular.js:12600:31)
            at Scope.$apply (D:/Tb_test/Campaign_Builder_Maven/campaign-builder-webapp/src/main/webapp/js/libraries/uncompressed/angular.js:12892:24)
            at Object.<anonymous> (D:/Tb_test/Campaign_Builder_Maven/campaign-builder-webapp/src/test/js/campaignEditSpec.js:40:9)
PhantomJS 1.9.8 (Windows 7): Executed 2 of 2 (1 FAILED) (0.008 secs / 0.024 secs)
Chrome 41.0.2272 (Windows 7): Executed 2 of 2 (1 FAILED) (0.051 secs / 0.047 secs)
TOTAL: 2 FAILED, 2 SUCCESS

【问题讨论】：

标签： angularjs jasmine karma-runner httpbackend

【解决方案1】：

我们可以在 karma 输出中看到测试失败，因为 URL 错误。你得到的是未定义的，而不是广告系列 ID。

Chrome 41.0.2272 (Windows 7) campaignEditCtrl as vm should run the Test to get the campaign data from the backend FAILED
        Error: Unexpected request: GET ./webresources/campaign/getCampaignDetails/undefined
        Expected GET ./webresources/campaign/getCampaignDetails/CMP1000004568

您似乎正在尝试测试您的 getCampaignDetails() 函数，该函数将 vm.campaignId 作为参数传递给您的服务调用。但是，在您的测试中，在调用您的函数之前，您没有将 vm.campaignId 设置为任何内容。

在您的测试设置中，我会尝试将您的代码更改为：

    scope = $rootScope.$new();
    controller = $controller;
    campaignId= "CMP1000004568";
    //service = Campaign;
    createController = function() {
        var controller = $controller('campaignEditCtrl', {
            '$scope': scope
        });
        scope.vm.campaignId = campaignId;
        return controller;
    };

...看看能不能解决问题。

这里发生的事情是您的getCampaignDetails() 函数的行为取决于您的控制器的状态。您的控制器具有initialize() 功能，可将您的控制器带到getCampaignDetails() 可以成功的状态。但是，在您的测试中，您不会执行类似的初始化。

【讨论】：

您好，感谢您的回复。我根据您的回答对测试进行了更改，但我收到 TypeError: 'undefined' is not an object (evalating 'scope.vm.campaignId = campaignId')。
你能把你的代码放在一个 jsfiddle 中，这样我们就可以“摆弄”它了吗？