AykutSarac/jsoncrack.com · error
error
Error message
error
What it means
The catch in this useEffect is meant to guard type generation via json_typegen_wasm, json2go, and gofmt.js. But the Go branch uses nested .then() chains and the else branch calls transformer(...).then(setType) with no .catch — so promise rejections ESCAPE this try/catch entirely. The try block completes synchronously (it only kicks off the import) and the catch guards none of the async resolution. Any WASM failure, invalid JSON input, or gofmt parse error becomes an unhandled promise rejection rather than being caught here.
Source
Thrown at apps/www/src/features/modals/TypeModal/index.tsx:87
},
[selectedType]
);
React.useEffect(() => {
if (opened) {
try {
if (selectedType === Language.Go) {
import("../../../lib/utils/json2go").then(jtg => {
import("gofmt.js").then(gofmt => {
const types = jtg.default(getJson());
setType(gofmt.default(types.go));
});
});
} else {
transformer({ value: getJson() }).then(setType);
}
} catch (error) {
console.error(error);
}
}
}, [getJson, opened, selectedType, transformer]);
return (
<Modal title="Generate Types" size="lg" opened={opened} onClose={onClose} centered>
<Stack pos="relative">
<Select
value={selectedType}
data={typeOptions}
onChange={e => {
setSelectedType(e as Language);
gaEvent("generate_type", { label: e as Language });
}}
allowDeselect={false}
/>
<ScrollArea.Autosize mah={400} maw={700}>
<CodeHighlightView on GitHub (pinned to 3c9af69e23)
Solutions
- Replace the .then() chains with await inside the try block so the catch actually covers async failures.
- If keeping promise style, append .catch() to every .then() chain.
- Pre-validate getJson() is JSON.parse-able before calling transformer.
- Show a toast on failure so the user knows generation failed instead of seeing a blank code panel.
Example fix
// before
try {
if (selectedType === Language.Go) {
import("../../../lib/utils/json2go").then(jtg => {
import("gofmt.js").then(gofmt => {
const types = jtg.default(getJson());
setType(gofmt.default(types.go));
});
});
} else {
transformer({ value: getJson() }).then(setType);
}
} catch (error) {
console.error(error);
}
// after
try {
if (selectedType === Language.Go) {
const jtg = await import("../../../lib/utils/json2go");
const gofmt = await import("gofmt.js");
const types = jtg.default(getJson());
setType(gofmt.default(types.go));
} else {
setType(await transformer({ value: getJson() }));
}
} catch (error) {
console.error(error);
setType("");
} Defensive patterns
Strategy: try-catch
Validate before calling
// Ensure the editor JSON is valid before opening the modal path
function safeGetJson(getJson: () => string): string | null {
try {
JSON.parse(getJson());
return getJson();
} catch {
return null;
}
} Type guard
function isLanguage(value: unknown): value is Language {
return typeof value === "string" && Object.values(Language).includes(value as Language);
} Try / catch
try {
if (selectedType === Language.Go) {
const jtg = await import("../../../lib/utils/json2go");
const gofmt = await import("gofmt.js");
setType(gofmt.default(jtg.default(getJson()).go));
} else {
setType(await transformer({ value: getJson() }));
}
} catch (error) {
console.error(error);
setType("");
} Prevention
- Never use .then() without .catch() inside a useEffect that has a try/catch — the catch will not see async rejections; use await instead.
- Clear stale type output on failure so users are not misled by old content.
- Pre-validate getJson() is JSON.parse-able before invoking the WASM transformer.
When it happens
Trigger: Opening the TypeModal while the editor holds invalid JSON; selecting Go when getJson() returns incomplete JSON so json2go produces output gofmt.js cannot parse; json_typegen_wasm WASM asset blocked by CSP/ad-blocker; selectedType value json_typegen_wasm does not recognize as output_mode.
Common situations: User edits JSON with a live syntax error then opens Generate Types; ad-blocker or corporate proxy blocks the WASM download; enum drift between the Language enum and json_typegen_wasm output_mode strings; unhandled rejection logged but UI silently shows empty/stale type output.
Related errors
AI-assisted analysis of AykutSarac/jsoncrack.com@3c9af69e23 (2026-08-12).
Data as JSON: /api/errors/a1d63b15cfe6abb2.
Report an issue: GitHub.