$httpbackend from ngMockE2E never called

Question

I'm trying to make some backendless e2e tests, so I need to mocks API calls. Here is what I did:

angular.module('foo.bar.e2eConf', ['foo.bar', 'ngMockE2E']).
  run(function($httpBackend) {
    $httpBackend.whenGET('/foo/bar').respond({foo:'bar'});
  });

Then I configured my conf/karma.e2e.conf like this (pathes are ok):

var basePath = '../';
var files = [
  ANGULAR_SCENARIO,
  ANGULAR_SCENARIO_ADAPTER,
  // bower libs
  'components/angular/index.js',
  'components/jquery/jquery.js',
  'components/angular-resource/index.js',
  'components/angular-mocks/index.js',
  'components/chai/chai.js',
  'test/chai.conf.js',
  'src/app/**/*.js',
  {pattern:'src/app/**/partials/*.tpl.html', included:false},
  'test/e2e/**/*.js'
];
var singleRun = false;
var browsers = ['Chrome'];
var proxies = {'/': 'http://localhost:8000/'};

I can run tests that doesn't involve API calls, but when I run a test that involves it I get a nice Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:9876/foo/bar

I guess I misconfigured some stuff, but I can't figure out what??

Is there a conflict between the proxy and the mock? i.e. proxying /foo/bar to http://localhost:8000/foo/bar instead of using the mock?

Any idea?

Regards

Xavier

score 1 · Accepted Answer · answered Jun 07 '13 at 07:57

1

You need to create a version of your app that bootstraps off the foo.bar.e2eConf module, instead of bootstrapping off the foo.bar module.

You'll have to include the javascript files angular-mocks.js and the new module you defined above in your app index page.

You should be able to test this outside Karma by just using this new app and seeing it return data from your mocks.

You probably don't need to add half those files to the Karma configuration. That's just for adding files to the testing scenario.. its going to load your app in an iframe and your app is responsible for loading it's own javascript.

I'm using php to server up either version of the app depending on what URL I use: either the real version that uses the api calls, or the e2e version that uses the mocks.

answered Jun 07 '13 at 07:57

Karen Zilles

7,633
3
34
33

hi, thanks, so i just need to change to `angular.module('foo.bar', ['ngMockE2E']).run(...)` and including it to the index.html? (plus required deps) – xavier.seignard Jun 08 '13 at 08:07
thanks, with your comment i understood that stuff i made a minimal project with e2e testing with ngMockE2E::$httpBackend: https://github.com/xseignard/e2eMock I still need to conditionally put the test scripts in the html, any idea on how to achieve that? or a cleaner way with angular.bootstrap? see : https://github.com/xseignard/e2eMock/blob/master/src/index.html#L18 – xavier.seignard Jun 08 '13 at 11:05
i'm planning to use that for the conditional import : http://stackoverflow.com/questions/12401998/have-grunt-generate-index-html-for-different-setups/14970339#14970339 – xavier.seignard Jun 08 '13 at 11:36
That should work. I serve my angular app from php, so I have condition code there. – Karen Zilles Jun 08 '13 at 19:59

$httpbackend from ngMockE2E never called

1 Answers1