0ddc7e8fad
This PR updates the testing guides to use App Router and TypeScript, also updates `/examples` to show `app` and `pages` examples. ## Overview - [x] Create a new "Testing" section that is shared between `app` and `pages`. - [x] Explain the differences between E2E, unit testing, component testing, etc. - [x] Recommend E2E for `async` components as currently none of the tools support it. - [x] Update setup guides for **Cypress**, **Playwright**, and **Jest** with latest config options, and examples for `app` and `pages`. - [x] Add new guide for **Vitest** - [x] Clean up `/examples`: use TS, show `app` and `pages` examples, match docs config ## Cypress - [x] E2E Tests - [x] Component Testing - [x] Client Components - [x] Server Components - [ ] `async` components **Blockers:** - TS: `Option 'bundler' can only be used when 'module' is set to 'es2015' or later`. In **tsconfig.json** compilerOptions, Next.js uses "moduleResolution": "bundler", changing it to "node" fixes the issue but it can have repercussions. - https://github.com/cypress-io/cypress/issues/27731 - Version 14 is currently not supported for component testing - https://github.com/cypress-io/cypress/issues/28185 ## Playwright - [x] E2E Tests ## Jest - [x] Unit Testing - [x] Client Components - [x] Server Components - [ ] `async` components: https://github.com/testing-library/react-testing-library/issues/1209 - [x] 'server-only': https://github.com/vercel/next.js/pull/54891 - [x] Snapshot Testing **Blockers:** - TS: https://github.com/testing-library/jest-dom/issues/546 - None of the solutions in the issue work with Next.js v14.0.4 and TS v5 ## Vitest - [x] Unit Testing - [x] Client Components - [x] Server Components - [ ] `async` components - [x] 'server-only' - [x] Update vitest example - [x] Handles CSS, and CSS modules imports - [x] Handles next/image ## Other - https://github.com/vercel/next.js/issues/47448 - https://github.com/vercel/next.js/issues/47299
37 lines
785 B
JSON
37 lines
785 B
JSON
{
|
|
"compilerOptions": {
|
|
"target": "es5",
|
|
"lib": ["dom", "dom.iterable", "esnext"],
|
|
"allowJs": true,
|
|
"skipLibCheck": true,
|
|
"strict": true,
|
|
"forceConsistentCasingInFileNames": true,
|
|
"noEmit": true,
|
|
"esModuleInterop": true,
|
|
"module": "esnext",
|
|
"moduleResolution": "bundler",
|
|
"resolveJsonModule": true,
|
|
"isolatedModules": true,
|
|
"jsx": "preserve",
|
|
"incremental": true,
|
|
"baseUrl": ".",
|
|
"paths": {
|
|
"@/components/*": ["components/*"],
|
|
"@/pages/*": ["pages/*"],
|
|
"@/styles/*": ["styles/*"]
|
|
},
|
|
"plugins": [
|
|
{
|
|
"name": "next"
|
|
}
|
|
]
|
|
},
|
|
"include": [
|
|
"next-env.d.ts",
|
|
"**/*.ts",
|
|
"**/*.tsx",
|
|
"types.d.ts",
|
|
".next/types/**/*.ts"
|
|
],
|
|
"exclude": ["node_modules"]
|
|
}
|