Diagnostic
Deux erreurs distinctes, différentes mais pas indépendantes :
-
Capture 1 — Console Error : "Encountered a script tag while rendering React component". Identique à BUG-002 capture 1. Mon fix précédent (sortir le script inline vers
public/theme-init.jsréférencé via<script src="/theme-init.js" />dans<head>) était insuffisant : React 19 + Next 16 émettent ce warning pour tout<script>rendu dans l'arbre Server Component, même avecsrc=(pas juste les inline). -
Capture 2 — Recoverable Error : "Hydration failed because the server rendered HTML didn't match the client". Diff visible sur
<span className="shrink-0 inline-flex items-center gap-1 text-sm text-zinc-600 dark:te..."→ un des 3 Link header (/concepts,/bugs,/carnet) ou interaction avec ThemeToggle (qui retournenullcôté server puis monte côté client). À investiguer.
Fix tenté (à vérifier côté user)
Dans app/layout.tsx : migration de <script src="/theme-init.js" /> vers <Script src="/theme-init.js" strategy="beforeInteractive" /> de next/script. Next injecte alors le script hors de l'arbre React, exécute avant le 1er paint, et le warning React doit disparaître.
Vérifications côté serveur :
npx tsc --noEmit: 0 erreur- SSR contient bien la référence
/theme-init.js(3 occurrences attendues par next/script) /theme-init.jstoujours servi enapplication/javascript
À tester côté user
- Hard refresh impératif (Cmd+Shift+R / Ctrl+Shift+R) sur iPhone Safari, sinon le vieux JS bundle reste en cache et tu verras encore l'ancien comportement.
- Ouvre la console DevTools — si la Capture 1 (script tag) est partie : ✅, on peut passer en RESOLVED.
- Si la Capture 2 (hydration span) persiste : log une nouvelle capture, j'investigue le ThemeToggle (
hydratedgate qui pourrait causer un re-mount post-hydration interprété comme mismatch en React 19).
Status laissé en OPEN en attendant la confirmation post-refresh.
Vérifications 2026-05-24
app/layout.tsx:47→<Script src="/theme-init.js" strategy="beforeInteractive" />toujours en placeapp/layout.tsx:42→suppressHydrationWarningsur<html>toujours présent- Confirmé en main par l'user : console propre après hard refresh, plus de "script tag inside React component" ni de mismatch d'hydration sur le span ThemeToggle
Fix final
Migration vers next/script strategy=beforeInteractive (déjà commité). Pas de changement supplémentaire.