Add debug log

Author: garronej

src/next-appdir/start.ts

@@ -38,8 +38,10 @@ export function startReactDsfr(params: {
                 "doPersistDarkModePreferenceWithCookie": false,
                 "registerEffectAction": action => {
                     if (isAfterFirstEffect) {
+                        console.log("We are after hydration, executing action now");
                         action();
                     } else {
+                        console.log("action delayed to be executed on hydration");
                         actions.push(action);
                     }
                 }

src/next-pagesdir.tsx

@@ -131,8 +131,10 @@ export function createNextDsfrIntegrationApi(
                 doPersistDarkModePreferenceWithCookie,
                 "registerEffectAction": action => {
                     if (isAfterFirstEffect) {
+                        console.log("We are after hydration, executing action now");
                         action();
                     } else {
+                        console.log("action delayed to be executed on hydration");
                         actions.push(action);
                     }
                 }

src/start.ts

@@ -30,6 +30,8 @@ export async function start(params: Params) {
     const registerEffectAction: (action: () => void) => void =
         nextParams === undefined ? action => action() : nextParams.registerEffectAction;
 
+    console.log("startClientSideIsDarkLogic", Date.now());
+
     startClientSideIsDarkLogic({
         "colorSchemeExplicitlyProvidedAsParameter": defaultColorScheme,
         "doPersistDarkModePreferenceWithCookie":
@@ -39,9 +41,19 @@ export async function start(params: Params) {
 
     (window as any).dsfr = { verbose, "mode": "manual" };
 
+    console.log("Start download DSFR js", Date.now());
+
     await import("./dsfr/dsfr.module" as any);
 
+    console.log("DSFR js downloaded", Date.now());
+
     const { dsfr } = window as unknown as { dsfr: { start: () => void } };
 
-    registerEffectAction(() => dsfr.start());
+    console.log("registering action dsfr.start", Date.now());
+
+    registerEffectAction(() => {
+        console.log("executing action dsfr.start", Date.now());
+
+        dsfr.start();
+    });
 }

src/useIsDark/client.ts

@@ -100,6 +100,21 @@ export function startClientSideIsDarkLogic(params: {
         const isDarkFromHtmlAttribute = getCurrentIsDarkFromHtmlAttribute();
 
         if (isDarkFromHtmlAttribute !== undefined) {
+            console.log(
+                `We had html theme attribute window.ssrWasPerformedWithIsDark: ${(() => {
+                    switch ((window as any).ssrWasPerformedWithIsDark as boolean | undefined) {
+                        case true:
+                            return "true";
+                        case false:
+                            return "false";
+                        case undefined:
+                            return "undefined";
+                        default:
+                            return "other";
+                    }
+                })()}`
+            );
+
             return {
                 "clientSideIsDark": isDarkFromHtmlAttribute,
                 "ssrWasPerformedWithIsDark":
@@ -150,6 +165,13 @@ export function startClientSideIsDarkLogic(params: {
 
         const isDarkFallback = false;
 
+        console.log({
+            isDarkExplicitlyProvidedAsParameter,
+            isDarkFromLocalStorage,
+            isDarkFromOsPreference,
+            isDarkFallback
+        });
+
         return {
             "ssrWasPerformedWithIsDark": isDarkExplicitlyProvidedAsParameter ?? isDarkFallback,
             "clientSideIsDark":
@@ -160,6 +182,8 @@ export function startClientSideIsDarkLogic(params: {
         };
     })();
 
+    console.log({ clientSideIsDark, ssrWasPerformedWithIsDark_ });
+
     ssrWasPerformedWithIsDark = ssrWasPerformedWithIsDark_;
 
     $clientSideIsDark.current = clientSideIsDark;