Using Karma in WebStorm - webstorm

Question

This is newbie question, but I could NOT find its answer on StackOverflow.
I am trying to use Karma in Webstorm. In my Spec file I am trying to require
dependent files, but 'require' itself is not defined!
It is running in Chrome under webstorm control. Here is my Karma.conf.js file and my Spec.js file.
The basic problem is that 'define', 'require', and 'requirejs' are all UNDEFINED. So how can I include any of them?!
karma.conf.js
// Karma configuration
// Generated on Tue Jul 19 2016 23:26:58 GMT-0700 (PDT)
requirejs = require('requirejs');
requirejs(["node-and-require"]);
requirejs("/ob/proj/uniformjs/main");
module.exports = function(config) {
requirejs("/ob/proj/uniformjs/main");
config.set({
// base path that will be used to resolve all patterns (eg. files, exclude)
basePath: 'js',
// frameworks to use
// available frameworks: https://npmjs.org/browse/keyword/karma-adapter
frameworks: ['jasmine'],
// list of files / patterns to load in the browser
files: [
'spec/**/*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: {
},
// spec 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: ['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
})
}
lexcore/SimpleUnitSpec.js
describe("A Unit", function () {
var u; // The unit being tested
beforeEach(function(){
var requirejs = require("requirejs");
var SimpleUnit = requirejs("lexcore/SimpleUnit");
u = SimpleUnit();
});
it("to be created and defined", function(){
expect(u).toBeTruthy();
});
});
Generates this error:
ReferenceError: require is not defined
at Suite.<anonymous> (....

Answer 1

This is because require() does not exist in the browser/client-side JavaScript.
You have three options:
Use tag.
Use a CommmonJS implementation. Synchronous dependencies like Node.js
Use an AMD implementation.
npm install requirejs
This option will install the latest release.
Download r.js
If you prefer to not use npm, you can get r.js directly:
Download r.js from the the download page and place it in your project.
Get the source from the r.js repo and either generate the r.js via "node dist.js", or grab a snapshot from the dist directory.
Usage
These instructions assume an npm installation of 'requirejs'. If you are using the r.js file directly, replace require('requirejs') with require('./path/to/r.js').
Basic usage is: require('requirejs')
Pass the main js file's "require" function in the configuration to requirejs.
Example:
var requirejs = require('requirejs');
requirejs.config({
//Pass the top-level main.js/index.js require
//function to requirejs so that node modules
//are loaded relative to the top-level JS file.
nodeRequire: require
});
requirejs(['foo', 'bar'],
function (foo, bar) {
//foo and bar are loaded according to requirejs
//config, but if not found, then node's require
//is used to load the module.
});

Answer 2

I think Thennarasan's answer may work, so I left it selected.
But here is how I managed to solve my own problem:
(1) During running of karma init I specified use of requirejs
(2) I refactored my code to use the requirejs format
The issue at play is that 'require' does not exist in the browser,
and Karma is injecting your node code into the browser.