@mandujs/core 0.54.29 → 0.54.30

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mandujs/core",
-  "version": "0.54.29",
+  "version": "0.54.30",
   "description": "Mandu Framework Core - Spec, Generator, Guard, Runtime",
   "type": "module",
   "main": "./src/index.ts",

package/src/bundler/build.test.ts

@@ -362,6 +362,40 @@ describe("buildClientBundles vendor shims", () => {
     expect((globalThis as typeof globalThis & { __MANDU_TEST_DEFAULT_PROPS__?: unknown }).__MANDU_TEST_DEFAULT_PROPS__).toBeUndefined();
   });
 
+  test("surfaces an island hydration failure to the DevTools hook (#324)", async () => {
+    const modulePath = path.join(rootDir, ".mandu", "client", "runtime-failing-boundary.js");
+    // A module that throws at import time → loadAndHydrate's catch runs.
+    await writeFile(modulePath, `throw new Error("boom at import");`, "utf-8");
+
+    const emitted: Array<{ type?: string; data?: { message?: string; islandId?: string } }> = [];
+    (window as unknown as { __MANDU_DEVTOOLS_HOOK__?: { emit: (e: unknown) => void } }).__MANDU_DEVTOOLS_HOOK__ = {
+      emit: (e: unknown) => {
+        emitted.push(e as { type?: string });
+      },
+    };
+
+    document.body.innerHTML = `
+      <div
+        data-mandu-island="failing--0"
+        data-mandu-src="${pathToFileURL(modulePath).href}?t=${Date.now()}"
+        data-hydrate="load"
+      ></div>
+    `;
+    (window as typeof window & { __MANDU_ROOTS__?: Map<string, unknown> }).__MANDU_ROOTS__ = new Map();
+
+    try {
+      const runtime = await evaluateGeneratedHydrationRuntime();
+      runtime.hydrateIslands();
+
+      await waitForRuntimeAssertion(() => emitted.some((e) => e.type === "error"));
+      const errorEvent = emitted.find((e) => e.type === "error");
+      expect(errorEvent?.data?.islandId).toBe("failing--0");
+      expect(errorEvent?.data?.message).toContain("boom at import");
+    } finally {
+      delete (window as unknown as { __MANDU_DEVTOOLS_HOOK__?: unknown }).__MANDU_DEVTOOLS_HOOK__;
+    }
+  });
+
   test("runtime hydrates default client boundary from boundary-local props", async () => {
     const modulePath = path.join(rootDir, ".mandu", "client", "runtime-default-boundary.js");
     await writeFile(

package/src/client/runtime-entry.ts

@@ -160,6 +160,7 @@ class IslandErrorBoundary extends Component<IslandErrorBoundaryProps, IslandErro
 
   componentDidCatch(error: Error, errorInfo: unknown): void {
     console.error("[Mandu] Island error:", this.props.islandId, error, errorInfo);
+    emitIslandHydrationError(this.props.islandId, error);
   }
 
   reset = (): void => {
@@ -371,6 +372,35 @@ function isManduIslandExport(value: unknown): value is ManduIslandExport {
     "definition" in value;
 }
 
+// #324: surface island hydration/render failures to the in-page DevTools so
+// its health badge and Issues counter reflect them instead of staying
+// "HEALTHY". Render-time errors are swallowed by IslandErrorBoundary and never
+// reach the global error listener, so we emit them to the devtools hook here.
+function emitIslandHydrationError(islandId: string, error: unknown): void {
+  const devtoolsHook = (window as Window & {
+    __MANDU_DEVTOOLS_HOOK__?: RuntimeDevtoolsHook;
+  }).__MANDU_DEVTOOLS_HOOK__;
+  if (!devtoolsHook) return;
+  try {
+    devtoolsHook.emit({
+      type: "error",
+      timestamp: Date.now(),
+      data: {
+        id: "island-" + islandId + "-" + Date.now(),
+        type: "runtime",
+        severity: "error",
+        message: error instanceof Error ? error.message : String(error),
+        stack: error instanceof Error ? error.stack : undefined,
+        timestamp: Date.now(),
+        url: location.href,
+        islandId,
+      },
+    });
+  } catch {
+    // DevTools must never break hydration.
+  }
+}
+
 async function loadAndHydrate(element: HTMLElement, src: string): Promise<void> {
   const id = element.getAttribute("data-mandu-island");
   if (!id) {
@@ -490,6 +520,7 @@ async function loadAndHydrate(element: HTMLElement, src: string): Promise<void>
   } catch (error) {
     console.error("[Mandu] Hydration failed for", islandId, error);
     element.setAttribute("data-mandu-error", "true");
+    emitIslandHydrationError(islandId, error);
 
     element.dispatchEvent(new CustomEvent("mandu:hydration-error", {
       bubbles: true,