Karma jasmine tests: Highlight diff in terminal - javascript

I'm using Karma with Jasmine for my tests. In some tests, I have large objects that the test relies on. When I do something like
expect(obj).toEqual(expectedObj);
and obj != expectedObj, I get an error message in my terminal. But this error is really long, because it includes both of the objects, and it's very hard to see, in what parts the two objects are different.
So, is there any highlighter for the terminal, that can be used along with karma? This way, it would be much more easy to figure out, what's wrong.

I had the same problem and what did it for me was karma-jasmine-diff-reporter.
Just install it:
npm install karma-jasmine-diff-reporter --save-dev
and configure it as a reporter, eg:
// karma.conf.js
module.exports = function(config) {
config.set({
reporters: ['jasmine-diff']
});
};
You can configure it to pretty print:
// karma.conf.js
module.exports = function(config) {
config.set({
reporters: ['jasmine-diff'],
jasmineDiffReporter: {
pretty: true, // 2 spaces by default for one indent level
matchers: {
toEqual: {
pretty: false // disable pretty print for toEqual
}
}
}
});
};
Output will be something like this:

Related

How to execute jasmine tests for node modules from grunt

I want to run some Jasmine 2.x tests for node.js modules in a Grunt build. My setup looks like this:
src/foo.js
exports.bar = 23;
spec/foo.spec.js
var foo = require("../src/foo.js");
define("foo", function() {
it("exports bar as 23", function() {
expect(foo.bar).toBe(23);
});
});
With grunt-contrib-jasmine the node module system is not available and I get
>> ReferenceError: Can't find variable: require at
>> spec/foo.spec.js:1
There is grunt-jasmine-node, but it depends on jasmine-node which is unmaintained and includes Jasmine 1.3.1, so this is not an option.
Jasmine supports node.js out of the box, by including a file jasmine.json in the spec directory, I can run the tests with the jasmine cli. Is there any clean way to run the same tests from grunt as well?
You could use grunt-exec, which just executes the value as if typed on the command line:
module.exports = function (grunt) {
grunt.initConfig({
exec: {
jasmine: "jasmine"
},
env: {
test: {
NODE_ENV: "test"
}
}
});
grunt.loadNpmTasks("grunt-exec");
grunt.loadNpmTasks("grunt-env");
grunt.registerTask("test", [
"env:test",
"exec:jasmine"
]);
};
This will allow you to keep jasmine up to date as well as use it with other grunt tasks.

grunt jasmine-node tests are running twice

I set up grunt to run node.js jasmine tests. For some reason, with this config, the results always show double the tests.
Here is my config:
I'm using jasmine-node which plugs into grunt.
/spec/some-spec.js:
var myModule = require('../src/myModule.js');
describe('test', function(){
it('works', function(done){
setTimeout(function(){
expect(1).toBe(1);
done();
}, 100);
});
});
Gruntfile.js:
module.exports = function(grunt) {
grunt.initConfig({
jasmine_node: {
options: {
forceExit: true
},
all: ['spec/']
}
});
grunt.loadNpmTasks('grunt-jasmine-node');
grunt.registerTask('default', ['jasmine_node']);
};
This results in two tests running rather than one.
> grunt
Running "jasmine_node:all" (jasmine_node) task
..
Finished in 0.216 seconds
2 tests, 2 assertions, 0 failures, 0 skipped
I was able to reproduce the behavior. This is what seems to be happening:
The task looks in the specified folder (spec in your case) for files with spec in the name.
Then it looks again in every folder in the whole project for files with spec in the name.
What it ends up with is 2 overlapping sets of test files to run.
My first attempt at trying to coerce it into more logical behavior was to set specNameMatcher: null (default is 'spec'), and leave the folder set to 'spec/'. This results in no tests being run, since apparently both conditions (name and folder) must be met for files in the specified folder. You get the same problem if specNameMatcher is left at the default value, but the files in the folder don't have 'spec' in the name.
What does work is to set the folder (or 'test set' or whatever you want to call it) to []:
jasmine_node: {
options: {
forceExit: true
},
all: []
}
The catch is that if you have any other files somewhere else in the project with 'spec' in the name, they'll be mistaken for tests by jasmine.
I would consider this behavior a bug, and it should probably be reported via the project's github issues page.
This grunt plugin ( https://github.com/jasmine-contrib/grunt-jasmine-node ) seems to be dead ( https://github.com/jasmine-contrib/grunt-jasmine-node/issues/60 ).
Maybe it is a better to switch to https://github.com/onury/grunt-jasmine-nodejs ?
The jasmine-node project is pretty old. The latest commit is from July of 2014. The grunt-jasmine-node plugin appears to be active, but running against something that is going stale seems a little pointless IMHO.
To test CommonJS modules using Jasmine I'd recommend using Karma along with the
karma-jasmine and karma-commonjs plugins. I got your example working with the following files:
package.json
{
"private": "true",
"devDependencies": {
"grunt": "^0.4.5",
"grunt-jasmine-node": "^0.3.1",
"grunt-karma": "^0.10.1",
"jasmine-core": "^2.3.4",
"karma": "^0.12.31",
"karma-commonjs": "0.0.13",
"karma-jasmine": "^0.3.5",
"karma-phantomjs-launcher": "^0.1.4"
}
}
karma.conf.js
module.exports = function(config) {
config.set({
basePath: '.',
frameworks: ['jasmine', 'commonjs'],
files: [{
pattern: 'src/**/*.js'
}, {
pattern: 'spec/**/*.js'
}],
preprocessors: {
'src/**/*.js': ['commonjs'],
'spec/**/*.js': ['commonjs']
},
reporters: ['progress'],
browsers: ['PhantomJS']
});
};
Gruntfile.js (optional if you still want to use grunt)
module.exports = function(grunt) {
grunt.initConfig({
karma: {
unit: {
configFile: 'karma.conf.js',
options: {
singleRun: true
}
}
}
});
grunt.loadNpmTasks('grunt-karma');
grunt.registerTask('default', ['karma:unit']);
};
You should also install the karma command line runner globally, just like you probably did with grunt. npm install -g karma-cli
From your command line you can start karma by typing karma start. It will run the tests and then watch your files and re-run them on every save. (VERY NICE)
Alternatively you can run karma start --single-run to have it just run your tests once and exit. If you also updated your Gruntfile you can also just run grunt to run the tests once.
The current up voted answer isn't the solution. You simply modify the expression that's going to match your tests. The answer is as follows:
module.exports = function(grunt) {
grunt.initConfig({
jasmine_node: {
options: {
forceExit: true
},
all: ['spec/*spec.js']
}
});
grunt.loadNpmTasks('grunt-jasmine-node');
grunt.registerTask('default', ['jasmine_node']);
};
Here you can see that 'all' is set to *'spec/spec.js'. This will search for all tests.
Secondly, just because a project hasn't had a recently commit, doesn't mean it's "old". jasmine-node is simply stable.
I have the same issue using grunt-jasmine-node, and as aeryaguzov points out, that project is no longer maintained. Switching to grunt-jasmine-node-new solves the issue for me.
grunt-jasmine-node-new is a fork of grunt-jasmine-node that is actively maintained, and can be found here: https://www.npmjs.com/package/grunt-jasmine-node-new

Foundation-Apps angular site integration with karma-jasmine unit testing

I believe there is a problem with using angular-mocks and foundation-apps when trying to run a karma jasmine unit test. It could also be that I have missed something. Since there is so much code to see I have posted an example project on github for review.
Basically the site runs fine and karma runs the test but when you debug into the angular.mocks.module function you find that your module from your app is not being loaded.
If you take foundation-apps out of the situation it will work fine.
Could this be a version conflict because foundation-apps has an older dependency for angular-mocks?
fatest on github
I hit the same issue and my solution was to add resulting css-file (app.css - generated with sass task) to karma configuration. Without this file i got:
TypeError: 'null' is not an object (evaluating 'mediaQueries[key].replace')
Here is my gulp config:
var karma = require('karma').server;
//...........//
// Compiles Sass
gulp.task('sass', function () {
return gulp.src('client/assets/scss/app.scss')
.pipe(plugins.sass({
includePaths: paths.sass,
outputStyle: (isProduction ? 'compressed' : 'nested'),
errLogToConsole: true
}))
.pipe(plugins.autoprefixer({browsers: ['last 2 versions', 'ie 10']}))
.pipe(gulp.dest('./build/assets/css/'))
.pipe(plugins.livereload());
});
/// ..... some other things here ......///
gulp.task('unit-test', function (done) {
var testFiles = [
{pattern:'./build/assets/js/foundation.js',watched:false},
{pattern:'./build/assets/js/routes.js',watched:false},
{pattern:'./build/assets/css/app.css',watched:false},
{pattern:'./build/assets/js/templates.js',watched:false},
{pattern:'./bower_components/angular-mocks/angular-mocks.js', watched:false},
{pattern:'./client/assets/js/*.js'},
{pattern:'./client/templates/**/*.js'}
];
karma.start({
configFile:__dirname + '/karma.conf.js',
singleRun: true,
files: testFiles
}, done);
});
Assuming your application is already builded, just run gulp unit-test.

Karma: Running a single test file from command line

So, I've been looking all over for this, found "similar" answers here, but not exactly what I want.
Right now if I want to test a single file with karma, I need to do fit(), fdescribe() on the file in question...
However, what I do want is to be able to just call karma, with the config file, and direct it to a specific file, so I don't need to modify the file at all, ie:
karma run --conf karma.conf.js --file /path/to/specific/test_file.js
is it possible to do this? Or with any helper? (using grunt or gulp?)
First you need to start karma server with
karma start
Then, you can use grep to filter a specific test or describe block:
karma run -- --grep=testDescriptionFilter
Even though --files is no longer supported, you can use an env variable to provide a list of files:
// karma.conf.js
function getSpecs(specList) {
if (specList) {
return specList.split(',')
} else {
return ['**/*_spec.js'] // whatever your default glob is
}
}
module.exports = function(config) {
config.set({
//...
files: ['app.js'].concat(getSpecs(process.env.KARMA_SPECS))
});
});
Then in CLI:
$ env KARMA_SPECS="spec1.js,spec2.js" karma start karma.conf.js --single-run
This option is no longer supported in recent versions of karma:
see https://github.com/karma-runner/karma/issues/1731#issuecomment-174227054
The files array can be redefined using the CLI as such:
karma start --files=Array("test/Spec/services/myServiceSpec.js")
or escaped:
karma start --files=Array\(\"test/Spec/services/myServiceSpec.js\"\)
References
karma-runner source: cli.js
karma-runner source: config.js
I tried #Yuriy Kharchenko's solution but ran into a Expected string or object with "pattern" property error.
Therefore I made the following modifications to his answer and now I'm able to run single files using Karma:
function getSpecs(specList) {
if (specList) {
return specList.toString();
} else {
return ['**/*_spec.js'] // whatever your default glob is
}
}
module.exports = function(config) {
config.set({
//...
files: [
{ pattern: getSpecs(process.env.KARMA_SPECS), type: "module"}
]
});
});
Note: This solution only works with a single file mentioned in the KARMA_SPECS env variable. Ex: export KARMA_SPECS="src/plugins/muc-views/tests/spec1.js"

Karma public api lacks configFile option

gulp-karma suggests an external config file like this:
module.exports = {
basePath: '',
singleRun: true
};
I want an external config file like this (grunt-karma style):
module.exports = function(config) {
config.set({
basePath: '',
singleRun: true
});
};
How to use the proper config file with karma API.
Details:
I am using gulp-karma, and as mentioned
there,
i have to implement it on my own.
Karma API is very simple:
var server = require('karma').server;
server.start(config, done);
config variable is vague. It is a plain object with configuration:
var config = {
basePath: '',
singleRun: true
// ...
}
Let's take a look at grunt-karma:
Sample grunt-karma config:
karma: {
unit: {
configFile: 'karma.conf.js'
}
}
grunt-karma configuration can take a configFile option, which is not documented anywhere.
I can see, i can pass a configFile option from karma source code:
var config = cfg.parseConfig(cliOptions.configFile, cliOptions);
Is there a documentation for the Karma API that mentions configFile option, how does grunt-karma know to
use it.
This question is surprisingly relevant, and most of these comments breeze over the actual question posed at the end of this post: "How does grunt-karma know to use a config object with a property called configFile.
I, too, have been wondering the same thing as that property is not listed anywhere in the karma config docs. For instance, if I would like to run my karma tests via the public API in my gulpfile. It would look like this:
...
var karmaConfig = require('spec/karma.conf.js');
// where my config file exports an object with properties like exclude:, path:
karma.start(karmaConfig)}, process.exit);
This would work fine, except if I wanted to export the config function so I can use the config constants (outlined here):
// allows me to do this
module.exports = function(config) {
config.set({
logLevel: config.LOG_INFO
});
}
But there's no way to get this to work unless you use something like this:
karma.start({configFile: 'spec/karma.conf.js'}, process.exit);
Where I simply pass in an object with a property configFile that points to the actual config file.
Karma docs don't mention this anywhere (as of this comment), but it's the only way to accomplish running my test via the API while using the config function export method.

Categories

Resources