How to: Test Next.js with Jest & RTL 🧪🤡
Let's enable Test-Driven Development and refactorings with confidence, by setting up Jest in our Next.js app!
Featuring the new, experimental, next/jest library which has far less boilerplate. Don't worry about Babel and let the SWC compiler do its thing 😄
We'll also set up React Testing Library, my favourite testing library by far. I even use its matchers when working with Cypress or Playwright, they really do help interact with your app like a real user would.
More in our "An app with Next.js" series: • An App with Next.js
Highlighted software:
Next.js: https://nextjs.org
Jest: https://jestjs.io/
React Testing Library: https://testing-library.com/docs/reac...
User Event: https://github.com/testing-library/us...
🎶 "Raincaller" by Valante, and "All Parts Equal" by Airae for the background music 🎶
Guess which famous track I wanted to use in place of "All Parts Equal" 🦑😂 Hope that bit still gets a chuckle!
See the code: https://github.com/jmagrippis/eri
No affiliations whatsoever: if I show something, you know you're hearing my unfiltered thoughts 😄
My own website: https://magrippis.com/
--
TIMESTAMPS
--
0:00 - 🧪 Next.js with Jest 🤡
0:18 - Installing deps, writing our jest.config.js
1:46 - Sample unit test: Currency formatter TDD
2:19 - React tests with Testing Library
3:33 - Form Test-Driven Development: Red Light / Green Light
4:12 - Comment, subscribe and come back for…
Watch video How to: Test Next.js with Jest & RTL 🧪🤡 online without registration, duration hours minute second in high quality. This video was added by user Johnny Magrippis 21 November 2021, don't forget to share it with your friends and acquaintances, it has been viewed on our site 8,085 once and liked it 190 people.