lundi 1 août 2016

Angular testing Jasmine fails

I am new to testing, have Angular experience. I developed a Angular application an want to add tests to it to get a grip on Jasmine and Karma. So I setup Karma, added a simple 'getGreeting' function to one of my services in my Angular app and added a test file (/test/UtilsService.spec.js) with the Jasmine test. It fails because the service is undefined (angular-mocks.js is added). This is my code:

karma.conf.js:

// base path that will be used to resolve all patterns (eg. files, exclude)
basePath: '',


// frameworks to use
// available frameworks: http://ift.tt/1ft83uu
frameworks: ['jasmine'],


// list of files / patterns to load in the browser
files: [
  'I:/www/ontdekJouwTalent/wwwroot/node_modules/angular/angular.min.js',
  'I:/www/ontdekJouwTalent/wwwroot/node_modules/angular-mocks/angular-mocks.js',
  'I:/www/ontdekJouwTalent/wwwroot/app/app.js',
  'I:/www/ontdekJouwTalent/wwwroot/app/**/*.js',
  'I:/www/ontdekJouwTalent/wwwroot/test/UtilsService.spec.js'
],


// list of files to exclude
exclude: [
],


// preprocess matching files before serving them to the browser
// available preprocessors: http://ift.tt/1gyw6MG
preprocessors: {
},


// test results reporter to use
// possible values: 'dots', 'progress'
// available reporters: http://ift.tt/1ft83KQ
reporters: ['progress'],


// web server port
port: 9876,


// enable / disable colors in the output (reporters and logs)
colors: true,


// level of logging
// possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
logLevel: config.LOG_DEBUG,


// enable / disable watching file and executing tests whenever any file changes
autoWatch: true,


// start these browsers
// available browser launchers: http://ift.tt/1ft83KU
browsers: ['Chrome'],


// Continuous Integration mode
// if true, Karma captures browsers, runs the tests and exits
singleRun: false,

// Concurrency level
// how many browser should be started simultaneous
concurrency: Infinity

}) }

Test file in /test/UtilsService.spec.js:

describe('getGreeting',function(){
var UtilsService;
beforeEach(module('app.ontdekJouwTalent'));
beforeEach(inject(
    function(_UtilsService_) {
        UtilsService = _UtilsService_;
    }
));
it('should test getGreeting function',
    function(){
        expect(1+1).toEqual(2);
        expect(UtilsService.getGreeting("Marc")).toEqual("Hello Marc");
    }
)

});

and the UtilsService in /app/shared/services/UtilsService.js

    angular.module('app.ontdekJouwTalent')
.service('UtilsService',['AppConfig',function(AppConfig){
    this.debug = function(data){
        if(AppConfig.APPCONSTANTS_ISLOCAL){
            return data;
        }
    }

    this.getGreeting = function(name){
        return "Hello " + name;
    }
}])

The angular app is defined elsewhere - in /app/app.js like this:

    angular.module('app.ontdekJouwTalent',
    ['angular-storage',
    'ui.bootstrap',
    'ui.router',
    'ui.router.modal',
    'xeditable',
    'angular-confirm',
    'ui.select',
    'ngSanitize',
    'angular-growl',
    'ngAnimate'
    ]
)

When running this from the webroo tdirectory (wwwroot) in a cmd window with "karma start" I get

        at Object.workFn (node_modules/angular-mocks/angular-mocks.js:3074:52)
        TypeError: Cannot read property 'getGreeting' of undefined
            at Object.<anonymous> (test/UtilsService.spec.js:12:23)
Chrome 51.0.2704 (Windows 10 0.0.0): Executed 1 of 1 (1 FAILED) ERROR (0.092 secs / 0.046 secs)

indicating that UtilsService is undefined. I have no clue how to tackle this. use angular.mock.module instead of module() in beforeEach(angular.mock.module('app.ontdekJouwTalent')); makes no difference, all files seem to be loading correctly... What is missing here???

Aucun commentaire:

Enregistrer un commentaire