janpeter/Ops-dashboard
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Allow unsafe-eval in dev CSP so next dev hydrates #81

Merged
janpeter merged 1 commit from claude/naughty-aryabhata-da1f3d into main 2026-06-12 19:48:31 +02:00
Conversation 0 Commits 1 Files changed 2 +24 -1
janpeter commented 2026-06-12 19:47:56 +02:00
Owner
Copy link

Probleem

npm run dev hydrateerde niet: de browser-console toonde een EvalError vanuit Next's react-refresh-runtime omdat proxy.ts script-src 'self' 'unsafe-inline' (zonder 'unsafe-eval') op álle responses zette, ook in development. Elke dev-sessie rendert dan SSR-only — geen interactiviteit, geen error-overlay.

Fix

De CSP voegt 'unsafe-eval' aan script-src toe wanneer NODE_ENV === 'development' — het patroon uit de officiële Next-docs (content-security-policy.md: "In development, 'unsafe-eval' is required … not required for production."). De productie-CSP is ongewijzigd.

test/proxy-csp.test.ts (stijl van navbar-build-info.test.ts) borgt dat 'unsafe-eval' precies één keer voorkomt en uitsluitend binnen de dev-ternary.

Verificatie

  • 58/58 tests groen (incl. 2 nieuwe, TDD: eerst rood gezien) en tsc --noEmit schoon
  • Dev-server header bevat nu script-src 'self' 'unsafe-inline' 'unsafe-eval'
  • Browser: console zonder EvalError/CSP-violations, [HMR] connected, theme-toggle flipt naar dark mode, login-formulier rendert "Invalid credentials" zonder navigatie → hydratie werkt end-to-end

🤖 Generated with Claude Code

## Probleem `npm run dev` hydrateerde niet: de browser-console toonde een `EvalError` vanuit Next's react-refresh-runtime omdat proxy.ts `script-src 'self' 'unsafe-inline'` (zonder `'unsafe-eval'`) op álle responses zette, ook in development. Elke dev-sessie rendert dan SSR-only — geen interactiviteit, geen error-overlay. ## Fix De CSP voegt `'unsafe-eval'` aan `script-src` toe wanneer `NODE_ENV === 'development'` — het patroon uit de officiële Next-docs (content-security-policy.md: *"In development, 'unsafe-eval' is required … not required for production."*). De productie-CSP is ongewijzigd. `test/proxy-csp.test.ts` (stijl van navbar-build-info.test.ts) borgt dat `'unsafe-eval'` precies één keer voorkomt en uitsluitend binnen de dev-ternary. ## Verificatie - 58/58 tests groen (incl. 2 nieuwe, TDD: eerst rood gezien) en `tsc --noEmit` schoon - Dev-server header bevat nu `script-src 'self' 'unsafe-inline' 'unsafe-eval'` - Browser: console zonder EvalError/CSP-violations, `[HMR] connected`, theme-toggle flipt naar dark mode, login-formulier rendert "Invalid credentials" zonder navigatie → hydratie werkt end-to-end 🤖 Generated with [Claude Code](https://claude.com/claude-code)
Next's dev runtime (react-refresh) needs eval; with the unconditional
CSP every dev session rendered SSR-only with an EvalError in the
console. The production CSP is unchanged; test/proxy-csp.test.ts
guards that 'unsafe-eval' never reaches the production branch.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Sign in to join this conversation.
Reviewers
No reviewers
Labels
Clear labels
No items
No labels
Milestone
Clear milestone
No items
No milestone
Projects
Clear projects
No items
No project
Assignees
Clear assignees
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference
janpeter/Ops-dashboard!81
No description provided.