Jasmine Angular http testing - angularjs

Question

I'm trying to test a REST API wrapped in an AngularJS service using Jasmine async testing. I know, I should be, and am, running tests on the API on the server, and using a mock $httpBackend to test the service.
but when i test this code :
'use strict';
describe('controllers: SiteCtrl', function() {
var scope, httpBackend, http, controller;
var zipcode = "94305";
beforeEach(module('ngMockE2E'));
beforeEach(module('ironridge'));
beforeEach(inject(function($rootScope, $controller, $httpBackend, $http) {
scope = $rootScope.$new();
httpBackend = $httpBackend;
controller = $controller;
http = $http;
// httpBackend.w hen('http://api.zippopotam.us/us/' + zipcode).respond({});
$controller('SiteCtrl', {
$scope: scope,
$http: $http
});
}));
it('should define more than 5 awesome things',function (){
expect(scope.nav.radio).toMatch('site');
});
it("should match a correct zip code", function() {
httpBackend.expectGET('http://api.zippopotam.us/us/' + zipcode).responde(200);
http.get('http://api.zippopotam.us/us/' + zipcode).
success(function(data) {
console.log(data);
}).
error(function(status) {
console.log(status);
});
httpBackend.flush();
});
});
but i get an error when running test
[16:01:41] all files 33.1 kB
[16:01:41] Finished 'scripts' after 1.06 s
[16:01:41] Starting 'test'...
WARN [watcher]: Pattern "/home/hpro/ironridge/src/**/*.mock.js" does not match any file.
INFO [karma]: Karma v0.12.37 server started at http://localhost:9876/
INFO [launcher]: Starting browser PhantomJS
INFO [PhantomJS 1.9.8 (Linux 0.0.0)]: Connected on socket Cfi_cbdTVW-YOCX8_BaV with id 45541989
PhantomJS 1.9.8 (Linux 0.0.0) controllers: SiteCtrl should match a correct zip code FAILED
TypeError: 'undefined' is not a function (evaluating 'httpBackend.expectGET('http://api.zippopotam.us/us/' + zipcode).responde(200)')
at /home/hpro/ironridge/src/app/site/site.controller.spec.js:28
PhantomJS 1.9.8 (Linux 0.0.0): Executed 2 of 2 (1 FAILED) (0.006 secs / 0.059 secs)
[16:01:42] 'test' errored after 1.41 s
[16:01:42] Error: 1
at formatError (/usr/lib/node_modules/gulp/bin/gulp.js:169:10)
at Gulp.<anonymous> (/usr/lib/node_modules/gulp/bin/gulp.js:195:15)
at Gulp.emit (events.js:107:17)
at Gulp.Orchestrator._emitTaskDone (/home/hpro/ironridge/node_modules/gulp/node_modules/orchestrator/index.js:264:8)
at /home/hpro/ironridge/node_modules/gulp/node_modules/orchestrator/index.js:275:23
at finish (/home/hpro/ironridge/node_modules/gulp/node_modules/orchestrator/lib/runTask.js:21:8)
at cb (/home/hpro/ironridge/node_modules/gulp/node_modules/orchestrator/lib/runTask.js:29:3)
at removeAllListeners (/home/hpro/ironridge/node_modules/karma/lib/server.js:215:7)
at Server.<anonymous> (/home/hpro/ironridge/node_modules/karma/lib/server.js:226:9)
at Server.g (events.js:199:16)
Thanks for help :D

Answer 1

You cannot do E2E tests with httpBackend.
First option, to forfit E2E tests, and make tests for $httpBackend, without e2e tests and run it from grunt running grunt test. Which would be unit tests.
Second option, which you can mix with first is to create separate file for E2E tests, also in Jasmine syntax and run it independly with protractor.
In edited code, use flush before calling handle.success.
Flushing means that get operation goes into action.
Instead of:
$http.get('http://api.zippopotam.us/us/' + zipcode).
then(handler.success,handler.error);
httpBackend.flush();
Write:
var prom = $http.get('http://api.zippopotam.us/us/' + zipcode);
httpBackend.flush();
prom.then(handler.success,handler.error);
It's possible that handler.success is called before flush is made.