Testing React Components

Karma and web-pack can be used for the motive of checking out React components. To do this, you need to begin with the aid of putting in the important libraries; otherwise, it will not paintings effectively.




Karma will examine from the document “karma.Conf.Js,, so we have to begin via setting it up. This is proven below:


var pack = require(‘webpack’);

module.Exports = function (config)


browsers: [ ‘Chrome’ ], //jogging in Chrome

singleRun: true, //need to be run once through default

frameworks: [ ‘mocha’ ], //the usage of the mocha check framework

files: [

‘tests.Webpack.Js’ // loading this file


preprocessors: ‘tests.Webpack.Js’: [ ‘webpack’, ‘sourcemap’ ] //preprocessing with the webpack and the sourcemap loader


reporters: [ ‘dots’ ], //document effects on this format

webpack: // copying of the webpack config devtool: ‘inline-supply-map’, // doing inline source maps in place of default


loaders: [

test: /.Js$/, loader: ‘babel-loader’




noInfo: true // avoid spamming the console if jogging in karma




Our next step needs to be to create a single document for you to employ the API web-pack required for locating the files that are needed automatically. ReactJS Online  Training

This is proven below:


var c = require.Context(‘./src’, true, /-take a look at.Js$/); // make certain


 which you have the listing and regex test being set correctly




We now need to write some tests. An example of that is proven below:


var React = require(‘react’); var TtUtils = require(‘react/lib/ReactTestUtils’); //It is right to apply Test Utils, but one could use the DOM API instead.


Var expect = require(‘expect’); var Root = require(‘../root’); // stay trying out is completed in components/__tests__/, as it's far what I want in my components


describe(‘root’, function ()

it(‘rendering with out a problems’, function ()

var root = TtUtils.RenderIntoDocument();




If you want to learn React, then Getting Started with ReactJS Training at onlineitguru is an excellent course to start with.

Started by meenati biswal at January 23, 2020 - 9:51 PM