Next.js Testing (Vitest & Playwright): Tests passed in CI but failed
Tests passed in CI but failed in production — the runtime env gap. Root cause: Tests ran against mocked env; prod used real values. The fix: Verify env parity; add E2E against a prod-like build.
A production war story from the TheCodeForge Next.js series — the incident, why it happened, and the exact fix.
⏳ Timestamps:
0:00 - Cold open: 500: Internal Server Error
0:09 - Version Compatibility: Next.js 16 and Vitest
0:51 - Production Caveat: Environment Variable Validation
1:14 - Intro
1:24 - What Is Testing Stack?
1:48 - Vitest Setup
2:21 - Playwright Setup
2:57 - E2E Checkout Test
3:14 - Server Action Tests
3:52 - Cache Testing
4:32 - Test Isolation
5:07 - Env Verification
5:44 - 500: Internal Server Error
6:09 - Missing env validation
6:27 - The Fix
6:49 - ⚠ Gotcha: No runtime env validation at startup
7:09 - ⚠ Gotcha: Running E2E tests against dev server
7:25 - ⚠ Gotcha: Mocked fetch returns success always
7:42 - Debugging Guide
8:01 - Interview Questions
8:30 - FAQ
8:58 - Key Takeaways
9:14 - Next up
9:38 - Wrap-up
👉 Full article + code: https://thecodeforge.io/javascript/ne...
⏭ Next up: Internationalization (i18n) in Next.js 16
#nextjs #javascript