Master NextJS testing with Vitest and React Testing Library || web boss
Get up to 97% off domain names, hosting and business email : https://namecheap.pxf.io/c/3973556/21...
This is a comprehensive guide on how to setup Vitest and React Testing Library in a NextJS codebase with support for absolute paths, importing svg as react components, using a custom render with react testing library and using React Context.
Timestamps:
00:00 - 00:31 - Course Overview
00:31 - 02:10 - Vitest and React Testing Library Configu Setup
02:10 - 02:35 Running tests
02:36 - 05:04 Rendering components with absolute paths in Vitest
05:05 - 06:27 Handling components rendering SVG as react components
06:28 - 08:43 Handling global state with React Context with React Testing Library
08:23 - 11:40 Creating a custom render with React Test Library
11:41 - 12:35 Making the custom render type safe
12:36 - 14:13 Setting up test coverage with vitest
14:15 - 14:56 Setup npm scripts for vitest test coverage
14:57 - 15:15 Outro; Kindly subscribe bestie :)
References:
NextJS Doc - Testing:Vitest : https://nextjs.org/docs/app/building-...
Common Errors in Vitest: https://nextjs.org/docs/app/building-...
Magical Svg: https://nextjs.org/docs/app/building-...
Subscribers count: 1,455
