how to test routes-react-router-dom-in-react-using-jest

Hello developers! In this post I have shared the details about “how to test routes-react-router-dom-in-react-using-jest”. Okay, let’s move on to the tutorial.

how to test routes-react-router-dom-in-react-using-jest

import React from 'react';
import  shallow, mount  from 'enzyme';
import Routes,  Home, News, NoMatch  from './Routes';
import  MemoryRouter
 from 'react-router'
import  Route  from 'react-router-dom';

let pathMap = ;
describe('routes using array of routers', () => 
  beforeAll(() => 
    const component = shallow(<Routes/>);
    pathMap = component.find(Route).reduce((pathMap, route) => 
        const routeProps = route.props();
        pathMap[routeProps.path] = routeProps.component;
        return pathMap;
      , );
      console.log(pathMap)
  )
  it('should show Home component for / router (getting array of routes)', () => 

    expect(pathMap['/']).toBe(Home);
  )
  it('should show News Feed component for /news router', () => 
    expect(pathMap['/news']).toBe(News);
  )
  it('should show News Feed component techdomain for /news router', () => 
    expect(pathMap['/news/techdomain']).toBe(News);
  )
  it('should show No match component for route not defined', ()=>
      expect(pathMap['undefined']).toBe(NoMatch);
  )
)

Conclusion

I hope this tutorial helps you to know about “how to test routes-react-router-dom-in-react-using-jest”. If you have any doubts regarding this post please let us know via the comment section. Share this post with your friends & family via social networks.

Hi, I'm Ranjith a full-time Blogger, YouTuber, Affiliate Marketer, & founder of Coder Diksha. Here, I post about programming to help developers.

Share on:

Leave a Comment