I am new to Karma , so the error might be very basic.
It is my karma.conf.js file
module.exports = function(config) {
config.set({
// base path that will be used to resolve all patterns (eg. files, exclude)
basePath: '',
// frameworks to use
// available frameworks: https://npmjs.org/browse/keyword/karma-adapter
frameworks: ['jasmine'],
// list of files / patterns to load in the browser
files: [
'bower_components/angular/angular.js',
'bower_components/angular-mocks/angular-mocks.js',
'bower_components/angular-resource/angular-resource.js',
'app/index.js',
'app/heroDetail.js',
'app/*.js',
'test/*.js',
'app/**/*.js',
'test/**/*.js'
],
// list of files to exclude
exclude: [
],
// preprocess matching files before serving them to the browser
// available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
preprocessors: {
},
// test results reporter to use
// possible values: 'dots', 'progress'
// available reporters: https://npmjs.org/browse/keyword/karma-reporter
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_INFO,
// enable / disable watching file and executing tests whenever any file changes
autoWatch: true,
// start these browsers
// available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
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
})
}
Inside app directory
my js
and html
files reside.
The index.html
looks like :
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Example - example-heroComponentSimple-production</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js"></script>
<script src="index.js"></script>
<script src="heroDetail.js"></script>
</head>
<body ng-app="heroApp">
<!-- components match only elements -->
<div ng-controller="MainCtrl as ctrl">
<b>Hero</b><br>
<hero-detail hero="ctrl.hero"></hero-detail>
</div>
</body>
</html>
And index.js
looks like :
(function(angular) {
'use strict';
angular.module('heroApp', []).controller('MainCtrl', function MainCtrl() {
this.hero = {
name: 'Miles Bronson'
};
});
})(window.angular);
Now in my test spec
file I tried :
describe('MainController',function(){
var $rootScope,
$scope,
controller;
beforeEach(function(){
module('heroApp');
inject(function($injector){
$rootScope = $injector.get('$rootScope');
$scope = $rootScope.$new();
controller = $injector.get('$controller')('MainCtrl',{$scope: $scope});
});
});
it('should initialize name of the hero',function(){
expect($scope.hero.name).toEqual('Miles Bronson');
});
it('should not pass',function(){
expect($scope.hero.name).toEqual('Milesl Bronsonkk');
});
});
Now when I do karma start karma.conf.js
it says
$ karma start karma.conf.js
18 01 2017 19:58:51.928:WARN [karma]: No captured browser, open http://localhost:9876/
18 01 2017 19:58:51.943:INFO [karma]: Karma v1.4.0 server started at http://0.0.0.0:9876/
18 01 2017 19:58:51.943:INFO [launcher]: Launching browser Chrome with unlimited concurrency
18 01 2017 19:58:51.953:INFO [launcher]: Starting browser Chrome
18 01 2017 19:58:54.145:INFO [Chrome 55.0.2883 (Windows 8.1 0.0.0)]: Connected on socket oOKBdNiWr9pVmcqnAAAA with id 12481546
Chrome 55.0.2883 (Windows 8.1 0.0.0) MainController should initialize name of the hero FAILED
TypeError: Cannot read property 'name' of undefined
at Object.<anonymous> (test/controllers/main-controller-spec.js:45:27)
Chrome 55.0.2883 (Windows 8.1 0.0.0) MainController should not pass FAILED
TypeError: Cannot read property 'name' of undefined
at Object.<anonymous> (test/controllers/main-controller-spec.js:49:27)
Chrome 55.0.2883 (Windows 8.1 0.0.0): Executed 2 of 2 (2 FAILED) ERROR (0.052 secs / 0.038 secs)
But the second one should have failed right while the first one should have passed ? Why is this unexpected behavior ?
What am I doing wrong ?
The chrome browser also does not help much ...
Please help!
I think maybe you've got a nesting problem and one too many describes...
Looks like you want something more like this, where the beforeEach fires before each test:
describe('MainController',function(){
var $rootScope,
$scope,
controller;
beforeEach(function(){
module('heroApp');
inject(function($injector){
$rootScope = $injector.get('$rootScope');
$scope = $rootScope.$new();
controller = $injector.get('$controller')('MainCtrl',{$scope: $scope});
});
});
it('should initialize name of the hero',function(){
expect($scope.hero.name).toEqual('Miles Bronson');
});
it('should not pass',function(){
expect($scope.hero.name).toEqual('Milesl Bronsonkk');
});
});
Furthermore, you're not really using global scope in your controller... I think your test can be much simpler in setup and assertions. Something like:
describe('TestMainController',function(){
beforeEach(module('heroApp'));
var $controller;
beforeEach(inject(function(_$controller_){
$controller = _$controller_;
}));
it('should initialize name of the hero',function(){
var controller = $controller('MainController');
expect(controller.hero.name).toEqual('Miles Bronson');
});
it('should not pass',function(){
var controller = $controller('MainController');
expect(controller.hero.name).toEqual('Milesl Bronsonkk');
});
});
Here's a plunkr: https://plnkr.co/edit/IAs4iYL69E8Nm5uvQDw1?p=preview
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.