Failed React test with console message: "Cannot find module 'react-router-dom'"

Question

I'm making a unit test in a React application (that i created with the command "create-react-app" without using any framework or build tool), that i am developing for a university project, using Jest and React Testing Library. One of the modules that i'm importing in the test file is the one below

import { BrowserRouter } from "react-router-dom";

I have this dependency installed in my package.json file, but i keep receiving the message below every time i try to start the test

Test suite failed to run
                                                                                                 
    Cannot find module 'react-router-dom' from 'src/App.test.js'                                 
                                                                                                 
      1 | import React from "react";                                                             
      2 | import { render, screen } from "@testing-library/react";                               
    > 3 | import { BrowserRouter } from "react-router-dom";
        | ^
      4 | import App from "./App";

I've tried to reinstall my dependencies, but it didn't work. Here is my package.json file:

{
  "name": "apoiaacao",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "axios": "^1.7.9",
    "bootstrap": "^5.3.3",
    "cra-template": "1.2.0",
    "react": "^18.2.0",
    "react-confirm-alert": "^3.0.6",
    "react-dom": "^18.2.0",
    "react-router-dom": "^7.1.5",
    "react-scripts": "^5.0.1",
    "react-toastify": "^11.0.3",
    "web-vitals": "^4.2.4"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": [
      "react-app",
      "react-app/jest"
    ]
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  },
  "devDependencies": {
    "@testing-library/jest-dom": "^6.6.3",
    "@testing-library/react": "^16.2.0",
    "eslint": "^8.57.1",
    "eslint-config-prettier": "^10.0.2",
    "jest": "^27.5.1",
    "prettier": "3.5.2",
    "prettier-eslint": "^16.3.0"
  }
}

I don't know why i can't run the test properly. I've seen some posts with problems similar to mine, but none of the solutions in the comments of those posts solved my problem. Maybe the only solution is to do a transition of my project to a Vite + React application.

Jest doesn't run in a browser, so you might want to try Router here instead. But your best bet is to not used the deprecated create-react-app in the first place. More info and suggestions here: react.dev/blog/2025/02/14/sunsetting-create-react-app — jmargolisvt
– jmargolisvt, Commented Mar 2 at 22:25

Jeff G · Accepted Answer · 2025-04-21 16:19:01Z

8

As of react-router v7, you need to change your import to from "react-router"

import { BrowserRouter } from "react-router";

Also you can change packages.json to install "react-router" instead of "react-router-dom":

  "dependencies": {
    ...
    "react-dom": "^18.2.0",
    "react-router": "^7.1.5",   // No longer react-router-dom
  }

Heads up that after you get that working, there's a fair chance you might then encounter this "TextEncoder not defined"…

edited Apr 21 at 16:19

answered Apr 21 at 16:13

Jeff G

1,1489 silver badges22 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Brahmanand Parida · Accepted Answer · 2025-05-30 19:17:32Z

0

I ran into a similar issue recently, and like you, I had already verified the install and import paths, cleared the cache, and even set NODE_PATH. What finally worked for me was downgrading react-router-dom and react-router to version 6: npm install react-router-dom@6 react-router@6 It seems like some versions of react-router-dom (especially 6.14+ or when using react-router v6.17+) can cause issues with certain test environments depending on your Jest setup or bundler config. Downgrading aligns the packages and avoids potential breaking changes or mismatches.

answered May 30 at 19:17

Brahmanand Parida

1

Collectives™ on Stack Overflow

Failed React test with console message: "Cannot find module 'react-router-dom'"

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related