Angular http testing

Question

I have a fairly simple controller that gets a simple json list of objects ...

function ProductGroupsCtrl($scope, $http, $routeParams, sharedService, popupService) {

$scope.list = null;
$scope.selectedItem = null;
$scope.selectedItemJsonString = '';

$scope.selectItem = function (item) {
    $scope.selectedItem = item;
    $scope.selectedItemJsonString = JSON.stringify(item);
    //alert(JSON.stringify(item));
};

$scope.closePopup = function () {
    $scope.selectedItem = null;
    $scope.selectedItemJsonString = '';
};

// sharedService.prepForBroadcast($routeParams.anotherVar);

$http({
    method: 'GET',
    url: '/ProductGroup'
}).success(function (data) {
    $scope.list = data;
}).
error(function (data) {
    $scope.message = 'There was an error with the data request.';
});

}

I then try to mock the request in the test class:

var scope, ctrl, $httpBackend, sharedServiceMock = {}, popupServiceMock = {};

beforeEach(inject(function (_$httpBackend_, $rootScope, $controller) {
    $httpBackend = _$httpBackend_;

    $httsypBackend.expectGET('/ProductGroup').
    respond([{
        ProductGroupID: 5,
        MenuTitle: "Promotional Products",
        AlternativeText: "Coming soon - a collection of environmentally friendly Promotional Products",
        OrdinalPosition: 5,
        Active: false
    }]);


    scope = $rootScope.$new();
    ctrl = $controller(ProductGroupsCtrl, {
        $scope: scope,
        $http: $httpBackend,
        sharedService: sharedServiceMock,
        popupService: popupServiceMock
    });}));

However I receive an error in the testacular window object undefined. What have I done wrong here?

Is the $httsypBackend in $httsypBackend.expectGET('/ProductGroup'). a typo? If not, that would be your problem. — dnc253
– dnc253, Commented Dec 3, 2012 at 20:15
Yes, that's a typo. I copied and pasted into another editor so I could get the question accepted as I use 2 tab spaces usually. :-) — Matthew Blott
– Matthew Blott, Commented Dec 3, 2012 at 23:21

Matthew Blott · Accepted Answer · 2012-12-04 11:11:03Z

1

Found the answer. If I remove the error callback function from the $http.get method then it works, i.e. remove the following ...

error(function (data) {
    $scope.message = 'There was an error with the data request.';
}

I have to say Angular sure is a steep learning curve for someone who is not a day to day JavaScript programmer (although I seem to be doing more and more). Thanks for the help anyway KatieK :-)

answered Dec 4, 2012 at 11:11

Matthew Blott

2093 silver badges10 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Angular http testing

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related