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.

 

Configuration

 

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)

config.Set(

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

module:

loaders: [

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

]

,

webpackServer:

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

 

c.Keys().ForEach(c);

 

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();

expect(root).ToExist();

);

);

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