$httpBackend in AngularJs Jasmine unit test
You need to place httpLocalBackend.flush() statement before expect($scope.stuff.length).toBe(2). Once you make a request you need to flush it for the data to be available in your client code.
it('should get stuff', function () {
var url = '/api/roles';
var httpResponse = [{ "stuffId": 1 }, { "stuffId": 2 }];
scope.getStuff(); //Just moved this from after expectGET
httpLocalBackend.expectGET(url).respond(200, httpResponse);
httpLocalBackend.flush();
expect($scope.stuff.length).toBe(2);
} );
Try this.
Timothy
I'm a Web developer from Shiloh, IL. I made my first website in 5th grade and it's been a passion ever since! I love C#, JavaScript, and SQL Server.
Updated on June 26, 2022Comments
-
Timothy almost 2 years
I'm unable to get my unit test to work properly. I have a $scope array that starts out empty, but should be filled with an $http.get(). In the real environment, there'd be approx 15 or so objects in the array, but for my unit test I just grabbed 2. For the unit test, I have:
expect($scope.stuff.length).toBe(2);
But jasmine's error is: Expected 0 to be 2.
here's my controller.js:
$scope.stuff = []; $scope.getStuff = function () { var url = site.root + 'api/stuff'; $http.get(url) .success(function (data) { $scope.stuff = data; }) .error(function(error) { console.log(error); }); };
and my controller.spec.js is:
/// <reference path="../../../scripts/angular-loader.min.js" /> /// <reference path="../../../scripts/angular.min.js" /> /// <reference path="../../../scripts/angular-mocks.js" /> /// <reference path="../../../scripts/angular-resource.js" /> /// <reference path="../../../scripts/controller.js" /> beforeEach(module('ui.router')); beforeEach(module('ngResource')); beforeEach(module('ngMockE2E')); beforeEach(module('myApplication')); var $scope; var controller; var httpLocalBackend; beforeEach(inject(function ($rootScope, $controller, $injector) { $scope = $rootScope.$new(); controller = $controller("StuffController", { $scope: $scope }); })); beforeEach(inject(function ($httpBackend) { httpLocalBackend = $httpBackend; })); it('should get stuff', function () { var url = '/api/stuff'; var httpResponse = [{ "stuffId": 1 }, { "stuffId": 2 }]; httpLocalBackend.expectGET(url).respond(200, httpResponse); $scope.getStuff(); expect($scope.stuff.length).toBe(2); //httpLocalBackend.flush(); } );
Now, obviously, I changed variable names and such since this is for work, but hopefully this is enough information for anybody to help me. I can provide more if needed. I also get a second error when uncommenting the .flush() line, but I'll get to that a bit later.
Any help is greatly appreciated and thanks in advance!
EDIT:
Finally got it working! Here's my final code:
it('should get stuff', function () { var url = '/api/stuff'; var httpResponse = [{ "stuffId": 1 }, { "stuffId": 2 }]; httpLocalBackend.expectGET(url).respond(200, httpResponse); $scope.getStuff(); httpLocalBackend.flush(); expect($scope.stuff.length).toBe(2); } );
EDIT 2: I ran into another problem, which I think may have been the root cause of this. See Unit test failing when function called on startup