I think I have everything set up properly. I followed the specs of the Karma Tutorial for RequireJS, but everything I've tried seems to result in the same error.
It appears that my test-main.js file is being loaded since a console.log() will fire. However, in the Object.keys loop, the files will get listed, but TEST_REGEXP fails so the allTestFiles ends up being an empty array. I'm sure it's something silly, but it's created just like the Tutorial - with the exception of using node_modules for jquery, require, underscore.
My test-main.js file:
var allTestFiles = [];
var TEST_REGEXP = /test\.js$/;
var pathToModule = function(path) {
return path.replace(/^\/base\//, '').replace(/\.js$/, '');
};
Object.keys(window.__karma__.files).forEach(function(file)
{
if(TEST_REGEXP.test(file))
{
// Normalize paths to RequireJS module names
allTestFiles.push(pathToModule(file));
}
});
if(console) console.log(allTestFiles);
require.config(
{
// Karma serves files under /base, which is the basePath from the config file
baseUrl: '/base/src',
paths:
{
'jquery':'../node_modules/jquery/dist/jquery',
'underscore':'../node_modules/underscore/underscore-min'
},
shim:
{
'underscore': { exports: '_' }
},
// dynamically load all test files
deps: allTestFiles,
// kick off jasmine, as it is asynchronous
callback: window.__karma__.start
});
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', 'requirejs'],
// list of files / patterns to load in the browser
files: [
'test/test-main.js',
{pattern: 'node_modules/jquery/dist/jquery.js', included: false},
{pattern: 'src/*.js', included: false},
{pattern: 'test/**/*Spec.js', included: false}
],
// list of files to exclude
exclude: [
'src/main.js'
],
// 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
});
};
I came across a solution to the problem.
I ended up changing my test-main.js file above the require.config section to this:
// Karma RequireJS configuration
var tests = [];
for (var file in window.__karma__.files) {
if (/Spec\.js$/.test(file)) {
tests.push(file);
}
}
If I simply changed TEST_REGEXP to /Spec\.js$/ I ended up getting a timestamp error. I don't know why. More interesting is why following the guide produces errors. But it is all working now.
Related
I have been trying to trigger the browser and open Google using Karma with Jasmine.
Karma console is giving the following error:
Karma error message
Selenium-standalone log:
Selenium standalone log
Karma.conf.js->
module.exports = function(config) {
config.set({
// base path that will be used to resolve all patterns (eg. files, exclude)
basePath: '',
plugins: [
'karma-browserify',
'karma-jasmine',
'karma-firefox-launcher'
],
// frameworks to use
// available frameworks: https://npmjs.org/browse/keyword/karma-adapter
frameworks: ['browserify','jasmine'],
// list of files / patterns to load in the browser
files: [
'../../../scripts/jasmineTest.spec.js'
],
// list of files / patterns to exclude
exclude: [
],
// preprocess matching files before serving them to the browser
// available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
preprocessors: {
'../../../scripts/jasmineTest.spec.js' : [ 'browserify' ]
},
browserify: {
debug: true,
// transform: [ 'brfs' ]
},
// 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: ['Firefox'],
// 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
})
}
My Jasmine script:
var wdio = require('../webdriverio')
describe("Jasmine test", function(){
var client = {}
client = wdio.remote({
desiredCapabilities: {
browserName: 'firefox'
}
})
client.init()
client.url("https://www.google.co.in")
it("test-1", function(done){
// expect(false).not.toBe(true)
// expect(2).toEqual(2)
done()
})
it("test-2", function(done){
// var a = ['A','B','C']
// expect(a).toContain('D')
done()
})
})
This is my first time making a project with Jasmine, and I'm following a tutorial but right off the bat having issues.
I've installed jasmine-node, typings, and typescript. I also ran:
typings install dt~jasmine --save-dev --global
For Jasmine typescript.
Now I have a test file in my ./spec folder that looks like this:
import { async, ComponentFixture, TestBed } from '#angular/core/testing';
import { DatePickerComponent } from '../src/components/via-datepicker.component';
import * as moment from 'moment';
const Moment: any = (<any>moment).default || moment;
describe('DatePickerComponent', () => {
let component: DatePickerComponent;
let fixture: ComponentFixture<DatePickerComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ DatePickerComponent ]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(DatePickerComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
it('should open when clicked', () => {
fixture.debugElement.nativeElement.querySelector('body').click();
fixture.whenStable().then(() => {
expect(component.opened);
});
component.close();
});
describe('While open', () => {
beforeEach(() => {
component.open();
});
describe('Pressing the "Today\'s date" button', () => {
it('should set the value of the picker to the current date and close it', () => {
fixture.debugElement.nativeElement.querySelector('.datepicker-buttons button').click();
expect(Moment().isSame(component.value, 'day') && Moment().isSame(component.value, 'month'));
expect(!component.opened);
});
});
describe('Clicking on a date', () => {
it('should change the value of the picker and close it', () => {
let oldValue: any = component.value;
fixture.debugElement.nativeElement.querySelectorAll('.day')[10].click();
expect(!component.opened);
expect(!component.value.isSame(oldValue));
});
});
});
});
But when I run this command:
node_modules/jasmine-node/bin/jasmine-node spec
I get this result:
Finished in 0 seconds
0 tests, 0 assertions, 0 failures, 0 skipped
So clearly my test file is being ignored. Or maybe I'm missing some library? Would I receive an error message if this were the case? The main issue here is that I'm not being given much direction as to what the issue is, other than Jasmine doesn't seem to "see" the test file for some reason.
Just trying to move forward with my project. Any advice would be greatly appreciated.
It appears as if your test runner doesn't know that you're trying to run typescript tests. Are you using Karma as your test runner? If so, you need to add your Typescript files to your karma.config file and install karma-typescript and configure your karma.config file similar to what is shown below. Pay close attention to the addition to the frameworks, files, and preprocessors sections.
karma.config
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', 'karma-typescript'],
// list of files / patterns to load in the browser
files: [
{ pattern: "app/tests/**/*.spec.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: {
"app/tests/**/*.spec.ts": ["karma-typescript"]
},
// 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: false,
// start these browsers
// available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
browsers: [],
// Continuous Integration mode
// if true, Karma captures browsers, runs the tests and exits
singleRun: true
})
};
First let me start by mentioning that all my unit tests works perfectly using gulp.
I'm trying to run my unit tests via Webstorm (v10) the problem is that the the karam.conf.js is pointing to the compiled js files, and not to the original files... is there a way to tell Webstorm to compile the files first before it runs the tests?
here is my karam.conf.js: (please note that the pre-compiled files are at the same location but looks like *.spec.js)
module.exports = function (config) {
'use strict';
config.set({
basePath: '',
frameworks: ['mocha'],
files: [
'bundledTests/test/**/*.spec.bundle.js'
],
// reporters configuration
reporters: ['mocha'],
plugins: [
'karma-mocha-reporter',
'karma-mocha',
'karma-phantomjs-launcher',
'karma-chrome-launcher'
],
//reporters: ['progress'],
port: 9876,
colors: true,
autoWatch: true,
singleRun: false,
usePolling: true,
atomic_save: false,
// level of logging
// possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
logLevel: config.LOG_INFO,
browsers: ["Chrome"] //'PhantomJS',
});
};
Any help would be much appreciated!
Use karma-babel-preprocessor.
Add preprocessors section into your karma.conf.js:
preprocessors: {
'src/**/*.js': ['babel'],
'test/**/*.js': ['babel']
},
Mark paths which need to be processed before running in tests.
I have simple test, that must work in webstorm using karma and requirejs.
The problem is that for some reason requirejs do not add ".js" for modules i was loading for tests. So it crashed trying to load "../ts/mamats/mama", while "../ts/mamats/mama.js" exists
Test (main.jasmine.js):
define(["require", "exports", "../ts/mamats/mama"], function(require, exports, mama) {
describe("first test", function () {
it("should be true", function () {
var object = new mama.block();
expect(object instanceof mama.block).toBe(true);
});
});
});
//# sourceMappingURL=main.jasmine.js.map
every thing works correctly when i replace "../ts/mamats/mama" with "../ts/mamats/mama.js"
sourceMappingURL here because javaScript file generated from typeScript source file, and because of that i cannot add ".js" for modules manually
Test starts with this entry point (main-test.js):
var tests = Object.keys(window.__karma__.files).filter(function (file) {
return (/\.jasmine\.js$/).test(file);
});
requirejs.config({
baseUrl: '/base',
deps: tests,
callback: window.__karma__.start
});
Why requirejs don't add ".js" for modules here?
Karma conf file:
module.exports = function(config) {
config.set({
basePath: '../',
frameworks: ['jasmine', 'requirejs'],
files: [
'static-tests/main-test.js',
{ pattern: 'static/**/*', included: false },
{ pattern: 'static-tests/**/*', included: false }
],
exclude: [],
preprocessors: {},
reporters: ['progress'],
port: 9876,
colors: true,
logLevel: config.LOG_INFO,
autoWatch: false,
browsers: ['Chrome'],
singleRun: false
});
};
Here is an interesting read on how RequireJs handles this:
http://requirejs.org/docs/api.html#jsfiles
Reading that makes it seem like an issue with RequireJS, but there seems to be some debate on whether or not that is true. Regardless, this gist seems to solve the issue.
var tests = Object.keys(window.__karma__.files).filter(function (file) {
return /\.spec\.js$/.test(file);
}).map(function(file){
return file.replace(/^\/base\/src\/js\/|\.js$/g,'');
});
require.config({
baseUrl: '/base/src/js'
});
require(tests, function(){
window.__karma__.start();
});
It looks like trouble in require.js
The problem is in next:
1. When in deps appear absolute path - requirejs stop add ".js" for any require call
2. When in deps appear file with extension, for some reason requirejs again stop add ".js" for modules
Other Solution here - to replace bathUrl and add it to requirejs conf do not help.
For me solution is next:
var tests = Object.keys(window.__karma__.files).filter(function (file) {
return (/\-jasmine\.js$/).test(file);
}).map(function (file) {
return file.replace(/^\/|\.js$/g, '');
});
and
baseUrl: '',
for requirejs.conf
and i have no idea why requirejs still add "/base" for all url that are requested, but now all works fine
I'm having troubles getting a simple karma test to run. I have the following code structure:
js/
|-- tests.js
|-- karma.config.js
|-- app/
|-- controllers.js
|-- tests/
|-- unit/
|-- loginSpec.js
|-- vendor/
|-- jquery.js
I'm following the documentation at http://karma-runner.github.io/0.8/plus/RequireJS.html and have my configuration set up as follow (minus the unimportant parts):
// base path, that will be used to resolve files and exclude
basePath = '';
// list of files / patterns to load in the browser
files = [
JASMINE,
JASMINE_ADAPTER,
REQUIRE,
REQUIRE_ADAPTER,
'tests.js',
{pattern: 'tests/unit/*.js', included: false}
];
In my controllers.js, I define a function called LoginCtrl and I want to test this function in loginSpec.js
define(['controllers'],function(controllers) {
describe('Login controllers', function() {
describe('LoginCtrl', function(){
it('should return 1', function() {
var scope = {},
ctrl = new LoginCtrl(scope);
expect(1).toBe(1);
});
});
});
});
The problem is my browser cannot load the controllers.js file eventhough I've set up my main test file's requirejs configuration (tests.js) as follow:
var tests = Object.keys(window.__karma__.files).filter(function (file) {
return /Spec\.js$/.test(file);
});
requirejs.config({
baseUrl: '/base/app',
paths: {
jquery: 'vendor/jquery',
},
deps: tests,
callback: window.__karma__.start
});
The browser does look for a file at http://localhost:9876/base/app/controllers.js. Isn't this the right path?
The path is not okay I think, it should be jquery: '../vendor/jquery', because the requirejs base points to the app dir. But this is not the only problem...
By karma you should add every file to the patterns you want to use. The files with the flag include: true will be runned by karma, the others can be used by tests. If two patterns cover a file name then the first pattern will override the second (so this is in reverse order than we usually do). In your case you should use something like this as karma.conf.js:
module.exports = function (config) {
config.set({
basePath: './',
frameworks: ['jasmine', 'requirejs'],
files: [
{pattern: 'tests.js', included: true},
{pattern: 'test/**/*.js', included: false},
{pattern: 'app/**/*.js', included: false},
{pattern: 'vendor/**/*.js', included: false}
],
exclude: [
],
reporters: ['progress'],
port: 9876,
colors: true,
logLevel: config.LOG_INFO,
autoWatch: true,
browsers: ['Firefox'],
captureTimeout: 6000,
singleRun: false
});
};
I had the similar problem, but I didn't find nice solution. I had to apply "hack" by adding .js extension to in my spec file, in your case try to change 'controllers' to 'controllers.js' in your loginSpec.js