Integrating Testing Libraries (Jest/Vitest) for Next.js 14 App Router Components
Unanswered
Philippine Crocodile posted this in #help-forum
Philippine CrocodileOP
I am currently working with Next.js 14 and using the app router feature for my project. I would like to integrate a testing library like Jest or Vitest to test my components effectively. Could you please provide guidance or resources on the best practices for setting up and running tests for app router components in Next.js 14?
4 Replies
@Philippine Crocodile I am currently working with Next.js 14 and using the app router feature for my project. I would like to integrate a testing library like Jest or Vitest to test my components effectively. Could you please provide guidance or resources on the best practices for setting up and running tests for app router components in Next.js 14?
One good way to start is to take a look in the docs: https://nextjs.org/docs/app/building-your-application/testing
Directly for vitest or jest you can use these guides:
Vitest: https://nextjs.org/docs/app/building-your-application/testing/vitest
Jest: https://nextjs.org/docs/app/building-your-application/testing/jest
Directly for vitest or jest you can use these guides:
Vitest: https://nextjs.org/docs/app/building-your-application/testing/vitest
Jest: https://nextjs.org/docs/app/building-your-application/testing/jest
Philippine CrocodileOP
But I can see in the docs that both the library does not support Server Components.
@Philippine Crocodile But I can see in the docs that both the library does not support Server Components.
yea, async server component are new to react and both currently don't support them. You can still run unit test with synchronous server and client component. If you need test for async components, I recommend you to use E2E tests
Philippine CrocodileOP
But E2E test doesn't run test cases on component code