2

I am currently using Protractor to test an AngularJS app, mocking its backend with browser.addMockModule() (based on the discussion on #125) and using the $httpBackend mock for E2E testing with an additional "data" module (myDataModule) that helps me manage the responses (in this.mockLayer), saving them in another file.

Here is a simplified version of the code:

//here I add the data module
browser.addMockModule('myDataModule', (mockLayer) => {
    angular.module('myDataModule', []).value('mockLayer', mockLayer);
}, this.mockLayer);

//then I mock the $httpBackend using the data module
browser.addMockModule('httpBackendMock', () => {
    angular.module('httpBackendMock', ['myDataModule'])
        .run(['$httpBackend', 'mockLayer', ($httpBackend, mockLayer) => {

        $httpBackend.whenGET(/\/api\/v1\.0\/foo\/bar/)
            .respond(200, mockLayer.fooBar);
        });

        let result = mockLayer.dummy( 3, 2 );
        // result is expected to be 5, right?

        //...
   }]);
});

And here the MockLayer class I instantiate and add as this.mockLayer:

export class MockLayer {
    constructor() {
        this.fooBar = {
            foo: 'bar'
        };
    }

    dummy( a, b ) {
        return a + b;
    }
}

The thing here is that even though mockLayer.fooBar is found and used with no issues on the second module, the function mockLayer.dummy() is not found. I get this on the console:

11:33:25.960 WARN - Exception thrown
org.openqa.selenium.WebDriverException: unknown error:
mockLayer.dummy is not a function

the API says about module.value():

Register a value service with the $injector, such as a string, a number, an array, an object or a function.

So I can use module.value() to save an object or a function. And an object with a function inside should be valid too.

Also, I understand the test code runs on the server (protractor) side and the app code runs on the client side (angular on the browser). But I'm not sure this have something to do with this behavior.

On the other hand, the protractor docs says this about browser.addMockModule():

this will be executed in the browser context, so it cannot access variables from outside its scope.

but this is not (as far as I understand) accessing any variable outside its scope.

So... what am I doing wrong? or is it a bug or something related to how protractor sends the code through webdriver to configure $httpBackend on the browser?

BTW, I am using

  • angular-mocks 1.5.0
  • protractor 2.5.1
  • babel ~5.8
  • chrome browser

It is worth pointing out this question looks similar to this one, but it was supposed to be fixed in protractor 1.8.

Community
  • 1
  • 1
germanio
  • 861
  • 1
  • 17
  • 27
  • Can you share your full function inside `addMockModule`? Is your `class MockLayer` defined inside there? You might also see what the compiled JS file is - TypeScript may be pulling `MockLayer` outside of the function call somehow. – Jmr Apr 14 '16 at 20:52
  • That is pretty much the full function, I mean, there are just a couple more calls to `$httpBackend`... Actually, if I define a function inside the `.run()`, it works fine, the problem is if it is added as part of the object used in `.value()` – germanio Apr 15 '16 at 18:06

0 Answers0