Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

In Jest test it says withRouter () is not a function

So I have a React application, and I've written lots of unit tests for my components. One such component is my VideoNavbar component. My tests were running perfectly for it, until I decided to wrap the default export of the component with withRouter(). Now my Jest tests fail to even start to run, with the following error:

FAIL test/components/AppContent/VideoNavbar/VideoNavbar.Spec.js
  ● Test suite failed to run

    TypeError: (0 , _reactRouterDom.withRouter) is not a function

Again, the test itself hasn't been changed at all. It was working perfectly, up until I added the withRouter() to it.

To make things even stranger, I have another component that I wrap with withRouter(), and it has Jest tests as well, and it doesn't get this error.

Lastly, the application still runs perfectly. I can start the whole thing up, and everything, including the VideoNavbar component, works. It's only in the Jest tests that this happens.

Anyone have any ideas for what this could be?

Edit: Here is a reduced version of my component to show how I'm importing and using withRouter(). I left a bunch of stuff out to focus on the important parts.

import React, { useState } from 'react';
import { Link, withRouter } from 'react-router-dom';

const VideoNavbar = (props) => {
    const [ isOpen, setOpen ] = useState(false);
    const { isScanning, history, startFileScan } = props;
    const pathname = history.location.pathname;

    return (
        <JsxIsHere />
    );
};

export default withRouter(VideoNavbar);
like image 525
craigmiller160 Avatar asked Mar 10 '19 00:03

craigmiller160


1 Answers

Ok, so it was a silly problem. I was importing withRouter() like this:

import { withRouter } from 'react-router-dom';

This was based on an auto-complete import that I got from WebStorm. However, the real import is:

import { withRouter } from 'react-router';

With that, everything works.

like image 122
craigmiller160 Avatar answered Sep 20 '22 13:09

craigmiller160