title: Angular + Karma + Jasmine - Testing and app with a fake backend
body: <p>I'm developing an angular WebApp and since the BackEnd is not still ready I'm using a fake backend (<code>$httpBackend</code>) to test my REST request.</p>
  
  <p>It is defined in app.js in this way:</p>
  
  <pre><code>// we want to use $httpBackend mock
  app.config(function($provide) {
    $provide.decorator('$httpBackend', angular.mock.e2e.$httpBackendDecorator);
  });
  // define our fake backend
  app.run(function($http, $httpBackend, url) {
    //Escape string to be able to use it in a regular expression
      function regEsc(str) {
          return str.replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g, "\\$&amp;");
      }
  
    // Mocking the login request
    //define the success var
    var user = {username: "me@stuff.it", password: "pass"};
    var userResponse = {
         "succes": "true",
         "user":{
         "id":"8490394",
         "username": "me",
         "token": "asd8u09u900asduijjaijjHJ"
        }
    };
    //success case
    $httpBackend.whenPOST(url.login, user).respond(200,userResponse);
  
    //other cases
    $httpBackend.whenPOST(url.login).respond(403,{success: false, message: 'Wrong username or password'});
  
    //let pass all views request
    $httpBackend.whenGET(function(string){
      console.log(string);
      return true;
    }).passThrough();
  
    $httpBackend.whenGET( RegExp( regEsc( "views/" ) ) ).passThrough();
  });
  </code></pre>
  
  <p>And it works properly when I run the Application with <code>grunt serve</code></p>
  
  <p>The problems begin when I try to run the test I worte (in Jasmine and executed trough Karma), here it is a sample test:</p>
  
  <pre><code>'use strict';
  
  describe('Service: Loginservice', function () {
  
    // load the service's module
    beforeEach(module('cmmApp'));
  
    // instantiate service
    var Loginservice, $rootScope, $httpBackend, url;
    beforeEach(inject(function (_Loginservice_, _$rootScope_ , $injector, _url_) {
      Loginservice = _Loginservice_;
      $rootScope = _$rootScope_;
      url = _url_;
  
      //questo serve per iniettare httpBackend
      $httpBackend = $injector.get('$httpBackend');
  
      $httpBackend.when('POST', url.login, {username:     "me@stuff.it",password:"pass"}).respond({success: true, user:{"id":"8490394","username": "me","token": "asd8u09u900asduijjaijjHJ"}});
  
      $httpBackend.whenPOST(url.login).respond(403, {success: false, message: 'Wrong username or password'});
    }));
  
  it('should return user object', function () {
  
      var f;
  
      //se i valori sono corretti ritona un oggetto che contiene l'utente
      inject(function(Loginservice, $rootScope){
        Loginservice.login({username:"me@stuff.it",password:"pass"}).then(function(res){
          f = res;
        }); //end login
  
        //this trigger the promise
        $rootScope.$digest();
  
        //this trigger the http request
        $httpBackend.flush();
  
        expect(f).toEqual({success: true, user:{"id":"8490394","username": "me","token": "asd8u09u900asduijjaijjHJ"}});
      }); //end inject
    });
  </code></pre>
  
  <p>They work perfectly if I remove the fake backend config from app.js, instead if I leave it there Karma report: <code>Error: No pending request to flush !</code></p>
  
  <p>I think that this is beacause of the interceptors declared in app.js are triggered and prevent the $httpBackend defined in the test to be triggered on a request.</p>
  
  <p>Any idea on how to solve this issue?</p>
  
  <p>Thanks in advance</p>