Writing Jest tests for searchParams in Next 15

Peter Jacxsens - Oct 28 - - Dev Community

This is the third part in a series were we look into using and testing the new searchParams interface in Next 15. In the first part we explained what changed in Next 15 and what the difference is between synchronous and asynchronous searchParams. In the second part we quickly went over the code for a little example app. In this part we are going to start writing tests for this example app using Jest.

Setup

We started with a clean Next 15 install (npx create-next-app@latest). We now have to manually install Jest, React Testing Library and some other things. We are just following instructions from the Next setup guide.

npm install -D jest jest-environment-jsdom @testing-library/react @testing-library/dom @testing-library/jest-dom ts-node
Enter fullscreen mode Exit fullscreen mode

Error

npm error code ERESOLVE
npm error ERESOLVE unable to resolve dependency tree
npm error
npm error While resolving: searchparams-next-15@0.1.0
npm error Found: react@19.0.0-rc-69d4b800-20241021
npm error node_modules/react
npm error   react@"19.0.0-rc-69d4b800-20241021" from the root project
npm error
npm error Could not resolve dependency:
npm error peer react@"^18.0.0" from @testing-library/react@16.0.1
Enter fullscreen mode Exit fullscreen mode

What happened? Next 15 is build on React 19 RC. It's a Release Candidate version of React, not a stable version.

@testing-library/react still runs on React 18. It has a development dependency of React 18 while Next 15 has a development dependency of React 19. Hence the error.

To be continued

Unfortunately this means we are stuck for now. No testing in Next 15. We have to wait for @testing-library/react to update and we cannot write tests for now. I will keep an eye on this and continue this series once @testing-library/react updates.

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Terabox Video Player