jasmine tests in karma: Uncaught ReferenceError: require is not defined

I was facing same issue, when trying to use require('module_name') (CommonJS style modules) inside a test case and running it using Karma.

The reason was require function is not available to browser (it is undefined). To provide it to browser we can browserify the test js files before Karma runs test case in browser using karma-browserify.

Install karma-browserify using npm install karma-browserify --save-dev

Update karma.conf.js

 frameworks: ['jasmine', 'browserify'],
 preprocessors: {
    'app/tests/*.js': [ 'browserify' ]
 },
 plugins: [..., 'karma-browserify'],

After these changes browserified file is run in browser by Karma, in which require is defined, and test case runs successfully


You might be using a glob pattern that is picking up stuff inside karma's bin directory. Try to execute your tests by using absolute paths to see if that fixes it.

If so then you know your glob pattern is grabbing stuff you did not want to.

For example change

{pattern: '**/**/*_test.js'},

to

{pattern: 'stuff/dashboard/home-page_test.js'},

see if that fixes your problem.


Karma is a test runner that runs your tests in a browser. Whatever browser you setup doesn't know what the require function is.

To use jasmine with node try jasmine-node. https://github.com/mhevery/jasmine-node

To have karma run jasmine node tests, try (wait for it....) jasmine-node-karma. https://npmjs.org/package/jasmine-node-karma

Here's the jasmine wiki pages where I found the above info. https://github.com/pivotal/jasmine/wiki

Hope this helps.


I've encountered today a similar issue. In my case the solution was quite simple. I am using Babel via Webpack to process .jsx files. Files with the .jsx extension did test successfully, while simple .js files throwed a reference error.

If anyone has a similar or equivalent setup they might be able to share the same solution.

In karma.config.js I had to specify preprocessors for .js files as I did for the .jsx ones. Here's an example:

preprocessors: {
  "app/tests/**/*.test.jsx": ["webpack", "sourcemap"],
  "app/tests/**/*.test.js": ["webpack", "sourcemap"]
},

I better add that in my case Webpack passes the code to Babel to compile so that it can run in the browser. I can copy and paste the entire webpack.config.js and karma.config.js if anyone needs them.