angular switch from test ng-app to dev ng-app

Question

So here is my problem I want to mock my data when I run tests or am offline but call the extarnal API when I can/want by using somthing like npm run protractor and npm run protractor-mock.

the solution I have cobbled together is having 2 index.html files one with the addition of mock (index-mock.html).

So my question is how can I tell setup protractor-mock to load index-mock.html

Note: as stated in the code GET('http://localhost:5000... is bad but not the issue at hand.

my files so far

index.html:

<!DOCTYPE html>
<html lang="en" ng-app="PCA" class="no-js">
...
<script src="bower_components/angular/angular.js"></script>
...
</html>

index-mock.html:

<!DOCTYPE html>
<html lang="en" ng-app="PCA" class="no-js">
...
<script src="bower_components/angular/angular.js"></script>
...
</html>

app.js:

'use strict';
angular.module('PCA', [
    'ngRoute',
    'chart.js',
    'ngDialog',
    'ngCsv'
]).config(function ($routeProvider) {
    $routeProvider.when('/', {
        templateUrl: 'views/chartContainer.html',
        controller: 'chartContainerCtrl'
    }).otherwise({redirectTo: '/'});
}).constant('config', {
    'apiUrl': 'http://localhost:5000'
});
//2nd app ->
angular.module('PCAMOCK', ['PCA', 'ngMockE2E'])
    .run(function($httpBackend) {
        $httpBackend.whenGET('http://localhost:5000/').respond({ //yes 'localhost:5000' this is bad but not the issues at hand
            "defaults": {
                "invURL": "http://www.invURL.com",
                "accountURL": "http://www.accountURL.com"
            }});
        $httpBackend.whenGET('http://localhost:5000/accounts').respond(200, {ciao:'mamma'}, {'Content-Type':'application/json'});
        $httpBackend.whenGET(/^/).passThrough();
        //...
});

package.json:

exports.config = {
  allScriptsTimeout: 11000,
  specs: [
    'tests/*.js'
  ],
  capabilities: {
    'browserName': 'chrome'
  },
  baseUrl: 'http://localhost:8000/app/',
  framework: 'jasmine',
  jasmineNodeOpts: {
    defaultTimeoutInterval: 30000
  }
};

score 0 · Accepted Answer · edited May 23 '17 at 12:22

You can get access to command-line argument in protractor. See How can I use command line arguments in Angularjs Protractor?. You should be able to use this to differentiate between two runs, and to change the URL you pass to browser.get?

Not directly your question, but you might want to look into Protractor's support for mock injection. See the addMockModule docs or http://eitanp461.blogspot.com/2014/01/advanced-protractor-features.html

You should not need to have two implementations of your app, it can be agnostic to the mock-or-not.

angular switch from test ng-app to dev ng-app

1 Answers1