I'm confronted with a strange error when executing my E2E tests.
A broadcasted event is not consumed by one of my directives anymore and therefore a particular view is not rendered correctly.
This does not occur only when I run the test alone.
And, this does not occur either when I run the test for the first time (singleRun=true) or the first run in debug mode.
The implemented event logic itself works fine.
What can cause this strange behavior?
My set up:
Karma version: 0.10.10
Angular version: 1.3.0
My Karma Config:
module.exports = function(config) {
config.set({
basePath: '',
files: [
'test/e2e/*.js'
],
singleRun: true,
frameworks: ['ng-scenario', 'jasmine-jquery', 'jasmine'],
browsers: ['Chrome'],
plugins: [
'karma-chrome-launcher',
'karma-jasmine-jquery',
'karma-jasmine',
'karma-junit-reporter',
'karma-ng-scenario'
],
junitReporter: {
outputFile: 'test-result.xml'
},
urlRoot: '/_karma_/',
proxies: {
'/': 'http://localhost:' + (process.env.PORT ? process.env.PORT : '8080') + "/"
},
});
};
Any hints are very much appreciated!
Thanks, Sebastian
As Thomas pointed out: Protractor is more appropriate for angular acceptance/E2E tests (https://docs.angularjs.org/guide/e2e-testing).
When using Protractor as test runner, the issue does not occur (at least not, when executing it only once [which was working fine with karma as well g]).
Thanks anyhow.
Related
I'm trying to create few simple tests for my Angular.JS app, but unfortunately, I can't resolve missing dependencies due to very short output from Angular / Karma (?)
My Karma config looks as follows:
module.exports = function (config) {
config.set({
basePath: '',
singleRun: true,
autoWatch: false,
frameworks: ['jasmine'],
browsers: ['PhantomJS'],
preprocessors: {
'./src/app/myApp.app.js': ['babel']
},
files: [
'./node_modules/angular/angular.js',
'./node_modules/angular-mocks/angular-mocks.js',
'./src/app/myApp.app.js',
'./test.js'
],
plugins: [
'karma-mocha-reporter',
'karma-jasmine',
'karma-babel-preprocessor',
'karma-phantomjs-launcher'
],
babelPreprocessor: {
options: {
presets: ['env'],
sourceMap: 'inline'
},
sourceFileName: function (file) {
return file.originalPath;
}
},
reporters: ['mocha']
});
}
What I'm doing here is basically including angular, angular-mocks, entry module for my app and one file with tests. Of course, some dependencies are missing now, but I'd like to add only required ones (and learn about missing steps after karma start).
Unfortunately, after running karma start I can only see that test has failed, and that's all - nothing more (for example, at runtime you can see 'rich' error message in browser's console, based on which you can include missing dependencies). Take a look at this error:
x it should do something funny
PhantomJS 2.1.1 (Mac OS X 0.0.0)
node_modules/angular/angular.js:4693:53
forEach#node_modules/angular/angular.js:325:24
loadModules#node_modules/angular/angular.js:4653:12
createInjector#node_modules/angular/angular.js:4575:30
WorkFn#node_modules/angular-mocks/angular-mocks.js:3120:60
And that's all. If I include minified version of Angular, I see a browser-like error message, based on which I can add required dependencies. With non-minified version, it's working like I've described. So my question is - how can I make error messages rich in karma tests?
I have a working karma setup, which shows the test-results of my jasmine-tests in the console.
If I start the Jasmine SpecRunner.html I get the error "module is not defined" Therefore I added the angular-mock inside the SpecRunner-Header:
<script type="text/javascript" src='src/public/js/libs/angular/angular-mock.js'></script>
Here's my karma.config:
config.set({
basePath: '../..',
frameworks: ['jasmine'],
files: [
'host/test_app/lib/jasmine-2.0.0/jasmine.js',
'host/test_app/src/public/js/libs/angular/angular.min.js',
'host/test_app/src/public/js/libs/angular/angular-mock.js',
'host/test_app/spec/*.js',
'host/test_app/src/public/js/controller/*.js'
],
exclude: [ ],
preprocessors: { },
reporters: ['progress'],
port: 9876,
colors: true,
logLevel: config.LOG_INFO,
autoWatch: true,
browsers: ['Chrome', 'Firefox'],
singleRun: false
});
Is there a way to make karma show the tests with jasmines specrunner?
try using an unminified angular.js instead of angular.min.js while debugging it would give you a more meaningful error.it worked to me before.
in addition to this, if your modules are injecting asynchronously you should move your angularjs to the top because karma is working like queue while injecting them into karma config file. if im wrong, please correct me.
I seem to be unable to wrap my head around the concept of testing AngularJS applications.
I use PHPstorm as my IDE and have successfully installed node.js aswell as karma through node.
I have then created a karma.config file:
module.exports = function(config) {
config.set({
basePath: '',
frameworks: ['jasmine'],
files: [
'js/angular.js',
'js/va.angular.js',
'test/**/**/*Spec.js'
],
exclude: [
],
reporters: ['progress'],
port: 9876,
colors: true,
logLevel: config.LOG_INFO,
autoWatch: false,
browsers: ['C:/Program Files (x86)/Google/Chrome/Application/chrome.exe'],
captureTimeout: 60000,
singleRun: false
});
};
I have also created a test file:
// mainSpec.js
describe('controllers', function(){
beforeEach(angular.module('va'));
it('should friggin test something', inject(function() {
var x = 5;
expect(x.toBe(5));
}));
});
However, as i try to run my test, it fails due to:
TypeError: Object #<Object> has no method 'apply'
TypeError: Object 5 has no method 'toBe'
Now i have 2 questions:
What am i doing wrong here?
Where does the karma stuff get the jasmine stuff from? To me it looks like it can't get it.
Make sure you're including the angular-mocks.js module in your list of files to load.
When you specify frameworks: ['jasmine'] in the karma config, it includes jasmine so there's no need to include it yourself.
As for your error,
expect(x.toBe(5))
should be:
expect(x).toBe(5)
When executing a karma runner using the PhantomJS browser the following error is produced:
*Selector [ng\:model="query.name"] did not match any elements*.
When executing with Chrome everything is working as expected.
Here's the line that should be matched:
`<input size='' style='width:3em;' ng-model="query.name" ng-change=changeQuery() ng-focus=focus($index) ng-blur=loseFocus($index)>`
karma.conf:
module.exports = function(config) {
config.set({
basePath: '../..',
frameworks: ['ng-scenario'],
plugins : [
'karma-ng-scenario',
'karma-chrome-launcher',
'karma-phantomjs-launcher',
'karma-junit-reporter'
],
files: [
'test/webapp/app/e2e/*.js'
],
exclude: [
],
proxies : {
'/': 'http://localhost:19880'
},
reporters: ['progress', 'junit'],
port: 9876,
colors: true,
logLevel: config.LOG_INFO,
autoWatch: false,
browsers: [ 'Chrome', 'PhantomJS'],
captureTimeout: 60000,
singleRun: false
});
NodeJS version: v0.10.17
Karma version: 0.10.2
PhantomJS version: 1.9
The root cause of the failure was that the PhantomJS is built with an old version of JavaScript that is missing the "bind" implementation (Why PhantomJS doesn't have Function.prototype.bind)
The controller logic was using currying, with the bind method, and thus caused the page render incorrectly. I found this out when exporting a rendered page with the phantomJS browser.
I removed all the bind method calls from the controller code and End2end test(s) are now passing as as expected.
I apologize that from the information that I have provided for the issue, it is impossible to deduct the problem cause.
I am experiencing a problem which I could not solve for some time, and getting very frustrating since I don't have an idea what I am doing wrong in it. :) Any help is much appreciated. I am using requirejs in my applications as well. This is basically what I am trying to build; https://github.com/Cengizism/base
When I try to start my e2e test I get this on my console;
INFO [karma]: Karma v0.10.0 server started at http://localhost:8080/_karma_/
INFO [launcher]: Starting browser Chrome
INFO [Chrome 28.0.1500 (Mac OS X 10.8.4)]: Connected on socket id n-0AVRliCogs2nWBfgDz
Chrome 28.0.1500 (Mac OS X 10.8.4): Executed 0 of 0 ERROR (0.208 secs / 0 secs)
My configuration file looks like this;
module.exports = function(karma) {
'use strict';
karma.set({
frameworks: ['jasmine', 'ng-scenario'],
files: [
'app/vendors/angular-scenario/angular-scenario.js',
'test/e2e/*.js'
],
basePath: '',
exclude: [],
reporters: ['progress'],
port: 8080,
runnerPort: 9100,
colors: true,
logLevel: karma.LOG_INFO,
autoWatch: true,
browsers: ['Chrome'],
captureTimeout: 5000,
singleRun: false,
proxies: {
'/': 'http://localhost:9000/'
},
urlRoot: '/_karma_/',
plugins: [
'karma-jasmine',
'karma-ng-scenario',
'karma-chrome-launcher',
'karma-firefox-launcher',
'karma-phantomjs-launcher'
]
});
};
and finally the spec file;
describe('Simple E2e Test', function()
{
it('Should open the front page and check', function()
{
browser().navigateTo('/#/partial1');
sleep(1);
expect(element('#test').html()).toEqual('Hi testUser1');
});
});
Maybe this could help you:
To fix it, the following line should be included in karma.conf.js
exclude: ['app/lib/angular/angular-scenario.js'],
Source : https://github.com/angular/angular-phonecat/issues/71
I'm not exactly clear on this either, but after running into this issue I removed the file angular-scenario from loading and was able to get the tests to run. I believe the problem is the difference between unit testing and e2e testing configuration.
I had this same error, and it went away once I started adding some tests. Is it possible the error just means there aren't any tests present?
It could be due to the relative paths you add in files [] which may be wrong.
I had the same error, and after it works fine !
In my case, the module format was wrong in a shim file that was only used by karma. I changed the format to 'register' to support SystemJS modules, per the documentation found here.
System.config({
packages: {
'base/dist/client': {
warnings: true,
defaultExtension: 'js',
format: 'register',
map: { }
}
}
});
This is what the TS output looked like. I have to assume that these tests were wrapped as system modules, so they were not loading properly. In other words, the error resulted from no tests running.
System.register(['angular2/testing', "./data-pipe"], function(exports_1) {
var testing_1, data_pipe_1;
return {
setters:[
function (testing_1_1) {
testing_1 = testing_1_1;
}
]
// yada, yada, yada..
}
}
});