Make app data loading safe under StrictMode
Some checks failed
Deploy Sokko G / deploy (push) Failing after 2s

This commit is contained in:
Shinuwa 2026-09-11 21:09:29 +02:00
parent b470a34b2a
commit 99d916f6db
6 changed files with 207 additions and 32 deletions

View file

@ -0,0 +1,44 @@
// Rôle : observe le chargement réel de l'application avec des réponses réseau contrôlées sous StrictMode.
import { createElement, StrictMode, useLayoutEffect } from "react";
import { createRoot } from "react-dom/client";
import { flushSync } from "react-dom";
import { useAppData } from "../../website/src/hooks/useAppData.js";
export function mountAppDataProbe(element, initialRoute) {
const originalFetch = globalThis.fetch;
const requests = [];
const snapshots = [];
const root = createRoot(element);
globalThis.fetch = (url, { signal } = {}) => new Promise((resolve) => {
// Le double ignore volontairement abort pour tester aussi les réponses déjà en cours.
requests.push({ url, signal, resolve, settled: false });
});
function Probe({ route }) {
const data = useAppData(route);
useLayoutEffect(() => { snapshots.push(data); });
return createElement("pre", { id: "data-state" }, JSON.stringify(data));
}
function navigate(route) {
snapshots.length = 0;
flushSync(() => root.render(createElement(StrictMode, null, createElement(Probe, { route }))));
}
navigate(initialRoute);
return {
snapshots,
requests: () => requests.map(({ url, signal, settled }) => ({ url, aborted: signal?.aborted, settled })),
respond(url, payload, status = 200, aborted = false) {
for (const request of requests) {
if (request.url !== url || request.settled || request.signal?.aborted !== aborted) continue;
request.settled = true;
request.resolve({ ok: status >= 200 && status < 300, json: async () => payload });
}
},
navigate,
unmount() {
flushSync(() => root.unmount());
globalThis.fetch = originalFetch;
}
};
}