angular - Protractor, mocking backend with angular2 on api request

Question

I could use some help to find a solution for my problem. I need to mock some data to my angular2 application when it makes a request to an api, I need to do something like:

$httpBackend.when('GET', '/userbookings/').respond(my json file data);

The problem is that all I can find on google, using the $httpBackend which is used for angularJS (angular 1).

Does any know how I can get this to work in my E2E test (The application is an angular2 applciation)? I'm trying to do this with both protractor or nightwatch (Have tried both frameworks)

Spec test:

describe('Protractor Mocking bookings for angular2 site', function() {

var ngMockE2E = require('ng-mock-e2e');

var $httpBackend = ngMockE2E.$httpBackend;

beforeEach(function() {
    ngMockE2E.addMockModule();
    ngMockE2E.addAsDependencyForModule('myApp');
    ngMockE2E.embedScript('/bower_components/angular-mocks/angular-mocks.js');
});


afterEach(function() {
    ngMockE2E.clearMockModules();
});

it('Inject mock data of bookings', function() {

    var EC = protractor.ExpectedConditions;
    var global = require('../bin/globals.js');

    // Bookings data in a json file which should be send as the response
    var mockData = require('../testData.json');

    browser.ignoreSynchronization = false;

    $httpBackend.when('GET', '/userbookings').respond(mockData);

    browser.get(global.so.enLoggedIn);

});

});

This test wont work because it's using some angular1 way. Have showed it, so you can see how my test looks like.

Hope someone can help me out here, cause its really hard to find some working with angular2.

Answer 1

Protractor does not yet support adding mock modules for Angular 2 applications:

// TODO: support mock modules in Angular2. For now, error if someone
// has tried to use one.
if (self.mockModules_.length > 1) {
  deferred.reject('Trying to load mock modules on an Angular2 app ' +
      'is not yet supported.');
}

And, I've also created a github issue for the TODO to draw attention:

• Support adding mock modules to Angular 2 applications

This, by the way, also means that protractor-http-mock is not gonna work since it relies on addMockModule internally. I've personally tried protractor-http-mock on a sample Angular2 application, got:

Failed: Trying to load mock modules on an Angular2 app is not yet supported.

Same is true for the http-backend-proxy and httpbackend packages.

---

I guess, while the issue is not yet fixed, you should consider firing up a proxy that would act as a sort of a "external mock" to your API backend, haven't done that personally, see more at:

• Running AngularJS Protractor with proxy to https
• Mocking and Stubbing with protractor