@async/framework 0.10.1 → 0.11.0

package/browser.ts

@@ -319,10 +319,20 @@ const __lazyRegistryModule = (() => {
         const resolved = resolveDescriptorUrl(type, id, descriptor, registryAssets);
         let modulePromise = moduleCache.get(resolved.moduleUrl);
         if (!modulePromise) {
-          modulePromise = Promise.resolve(importModule(resolved.moduleUrl));
+          modulePromise = Promise.resolve().then(() => importModule(resolved.moduleUrl));
           moduleCache.set(resolved.moduleUrl, modulePromise);
         }
-        const module = await modulePromise;
+        let module;
+        try {
+          module = await modulePromise;
+        } catch (cause) {
+          if (moduleCache.get(resolved.moduleUrl) === modulePromise) {
+            moduleCache.delete(resolved.moduleUrl);
+          }
+          throw new Error(`Lazy ${type} "${id}" failed to import ${resolved.moduleUrl}: ${errorMessage(cause)}`, {
+            cause
+          });
+        }
         const value = resolveExport(module, resolved.exportNames, type, id);
         exportCache.set(cacheKey, value);
         return value;
@@ -482,6 +492,10 @@ const __lazyRegistryModule = (() => {
     return /^[A-Za-z][A-Za-z\d+.-]*:/.test(value);
   }
 
+  function errorMessage(error) {
+    return error instanceof Error ? error.message : String(error);
+  }
+
   function stableStringify(value) {
     if (!value || typeof value !== "object" || Array.isArray(value)) {
       return JSON.stringify(value);
@@ -810,15 +824,7 @@ const __cacheModule = (() => {
 
       get(key) {
         assertKey(key);
-        const entry = entries.get(key);
-        if (!entry) {
-          return undefined;
-        }
-        if (entry.expiresAt !== undefined && entry.expiresAt <= now()) {
-          entries.delete(key);
-          return undefined;
-        }
-        return entry.value;
+        return readEntry(key).value;
       },
 
       set(key, value, options = {}) {
@@ -836,9 +842,9 @@ const __cacheModule = (() => {
         if (typeof fn !== "function") {
           throw new TypeError("cache.getOrSet(key, fn) requires a function.");
         }
-        const cached = registryApi.get(key);
-        if (cached !== undefined) {
-          return cached;
+        const cached = readEntry(key);
+        if (cached.found) {
+          return cached.value;
         }
         if (pending.has(key)) {
           return pending.get(key);
@@ -889,8 +895,8 @@ const __cacheModule = (() => {
       snapshot() {
         const snapshot = {};
         for (const [key] of entries) {
-          const value = registryApi.get(key);
-          if (value !== undefined) {
+          const { found, value } = readEntry(key);
+          if (found && value !== undefined) {
             snapshot[key] = value;
           }
         }
@@ -930,6 +936,18 @@ const __cacheModule = (() => {
       const prefix = key.split(":")[0];
       return definitions.get(prefix);
     }
+
+    function readEntry(key) {
+      const entry = entries.get(key);
+      if (!entry) {
+        return { found: false, value: undefined };
+      }
+      if (entry.expiresAt !== undefined && entry.expiresAt <= now()) {
+        entries.delete(key);
+        return { found: false, value: undefined };
+      }
+      return { found: true, value: entry.value };
+    }
   }
 
   function normalizeDefinition(definition) {
@@ -2148,7 +2166,7 @@ const __serverModule = (() => {
 
   function createServerProxy({
     endpoint = "/__async/server",
-    fetch: fetchImpl = globalThis.fetch?.bind(globalThis),
+    transport,
     signals,
     loader,
     router,
@@ -2156,8 +2174,8 @@ const __serverModule = (() => {
     scheduler,
     headers = {}
   } = {}) {
-    if (typeof fetchImpl !== "function") {
-      throw new TypeError("createServerProxy(...) requires fetch to be available.");
+    if (typeof transport !== "function") {
+      throw new TypeError("createServerProxy(...) requires a transport function.");
     }
 
     const defaults = { signals, loader, router, cache, scheduler };
@@ -2172,7 +2190,7 @@ const __serverModule = (() => {
       };
       assertJsonTransportable(body);
 
-      const response = await fetchImpl(joinEndpoint(endpoint, id), {
+      const response = await transport(joinEndpoint(endpoint, id), {
         method: "POST",
         headers: {
           "content-type": "application/json",
@@ -2449,14 +2467,17 @@ const __serverModule = (() => {
     return output;
   }
 
-  function assertJsonTransportable(value, seen = new Set()) {
+  function assertJsonTransportable(value, stack = new Set()) {
+    if (typeof value === "bigint") {
+      throw new Error("Server proxy JSON transport does not support BigInt values.");
+    }
     if (value == null || typeof value !== "object") {
       return;
     }
-    if (seen.has(value)) {
-      return;
+    if (stack.has(value)) {
+      throw new Error("Server proxy JSON transport does not support circular values.");
     }
-    seen.add(value);
+    stack.add(value);
 
     const tag = Object.prototype.toString.call(value);
     if (tag === "[object File]" || tag === "[object Blob]" || tag === "[object FormData]") {
@@ -2464,13 +2485,15 @@ const __serverModule = (() => {
     }
     if (Array.isArray(value)) {
       for (const item of value) {
-        assertJsonTransportable(item, seen);
+        assertJsonTransportable(item, stack);
       }
+      stack.delete(value);
       return;
     }
     for (const item of Object.values(value)) {
-      assertJsonTransportable(item, seen);
+      assertJsonTransportable(item, stack);
     }
+    stack.delete(value);
   }
 
   function joinEndpoint(endpoint, id) {
@@ -3115,6 +3138,7 @@ const __loaderModule = (() => {
           return;
         }
         destroyed = true;
+        markDestroyedScopes(rootNode);
         for (const cleanup of [...cleanups]) {
           runCleanup(cleanup);
         }
@@ -3565,6 +3589,12 @@ const __loaderModule = (() => {
       });
     }
 
+    function markDestroyedScopes(scope) {
+      for (const element of elementsIn(scope)) {
+        schedulerInstance.markScopeDestroyed(element);
+      }
+    }
+
     return api;
   }
 
@@ -3944,6 +3974,8 @@ const __routerModule = (() => {
 
   const route = defineRoute;
 
+  const routerModes = new Set(["csr", "spa", "ssr", "mpa"]);
+
   function createRouteRegistry(initialMap = {}, options = {}) {
     const registryStore = options.registry ?? createRegistryStore();
     const type = options.type ?? "route";
@@ -3990,7 +4022,7 @@ const __routerModule = (() => {
           }
           const params = {};
           candidate.keys.forEach((key, index) => {
-            params[key] = decodeURIComponent(match[index + 1] ?? "");
+            params[key] = safeDecodeURIComponent(match[index + 1] ?? "");
           });
           return {
             pattern: candidate.pattern,
@@ -4039,7 +4071,7 @@ const __routerModule = (() => {
   }
 
   function createRouter({
-    mode = "ssr-spa",
+    mode = "ssr",
     root,
     boundary = "route",
     routes = createRouteRegistry(),
@@ -4049,11 +4081,10 @@ const __routerModule = (() => {
     server,
     cache,
     partials,
-    fetch: fetchImpl = globalThis.fetch?.bind(globalThis),
-    routeEndpoint = "/__async/route",
     attributes,
     scheduler
   } = {}) {
+    assertRouterMode(mode);
     const documentRef = root?.ownerDocument ?? root ?? globalThis.document;
     const rootNode = root ?? documentRef;
     const signalRegistry = signals ?? loader?.signals ?? createSignalRegistry();
@@ -4105,11 +4136,11 @@ const __routerModule = (() => {
         }
         bindNavigation();
         if (mode === "csr") {
-          void api.navigate(currentUrl(), {
+          handleNavigation(api.navigate(currentUrl(), {
             replace: true,
             initial: true,
             source: "client"
-          }).catch(() => {});
+          }));
           return api;
         }
         updateStateFromLocation();
@@ -4122,16 +4153,13 @@ const __routerModule = (() => {
 
       prefetch(url) {
         assertActive();
-        if (mode === "ssr-spa" && typeof fetchImpl === "function") {
-          return fetchRoute(url, { prefetch: true });
+        if (mode === "mpa" || mode === "ssr") {
+          return Promise.resolve(null);
         }
         const matched = api.match(url);
         if (matched?.route?.partial && partials?.resolve?.(matched.route.partial)) {
           return partials.render(matched.route.partial, matched.params, contextFor(matched));
         }
-        if (typeof fetchImpl === "function") {
-          return fetchRoute(url, { prefetch: true });
-        }
         return Promise.resolve(null);
       },
 
@@ -4143,9 +4171,6 @@ const __routerModule = (() => {
         }
 
         const target = resolveUrl(url);
-        if (mode === "ssr-spa") {
-          return fetchRoutePartial(target, options);
-        }
         return renderLocalRoutePartial(target, options);
       },
 
@@ -4174,7 +4199,7 @@ const __routerModule = (() => {
           return;
         }
         event.preventDefault();
-        api.navigate(anchor.href);
+        handleNavigation(api.navigate(anchor.href));
       };
       const submit = (event) => {
         const form = closest(event.target, "form");
@@ -4182,9 +4207,9 @@ const __routerModule = (() => {
           return;
         }
         event.preventDefault();
-        api.navigate(formActionUrl(form));
+        handleNavigation(api.navigate(formActionUrl(form)));
       };
-      const popstate = () => api.navigate(currentUrl(), { history: false });
+      const popstate = () => handleNavigation(api.navigate(currentUrl(), { history: false }));
 
       rootNode.addEventListener?.("click", click);
       rootNode.addEventListener?.("submit", submit);
@@ -4233,31 +4258,6 @@ const __routerModule = (() => {
       }
     }
 
-    async function fetchRoutePartial(target, options = {}) {
-      const matched = api.match(target);
-      const navigation = beginNavigation(target, matched);
-      setMatchedRouterState(target, matched, { pending: true, error: null });
-
-      try {
-        const result = await fetchRoute(target.href, { signal: navigation.abort });
-        if (!isActiveNavigation(navigation)) {
-          return null;
-        }
-        await applyNavigationResult(result, target, options, navigation);
-        if (!isActiveNavigation(navigation)) {
-          return null;
-        }
-        setRouterState({ pending: false, error: null });
-        return result;
-      } catch (error) {
-        if (!isActiveNavigation(navigation)) {
-          return null;
-        }
-        setRouterState({ pending: false, error });
-        throw error;
-      }
-    }
-
     async function applyNavigationResult(result, target, options, navigation) {
       if (!isActiveNavigation(navigation)) {
         return;
@@ -4288,29 +4288,6 @@ const __routerModule = (() => {
       documentRef.defaultView?.history?.pushState?.({}, "", target.href);
     }
 
-    async function fetchRoute(url, { prefetch = false, signal } = {}) {
-      if (typeof fetchImpl !== "function") {
-        throw new Error("Router navigation requires a partial registry or fetch.");
-      }
-      const response = await fetchImpl(`${routeEndpoint}?to=${encodeURIComponent(String(url))}`, {
-        headers: {
-          accept: "application/json, text/html"
-        },
-        signal
-      });
-      if (!response.ok) {
-        throw new Error(`Route "${url}" failed with ${response.status}.`);
-      }
-      if (prefetch) {
-        return response;
-      }
-      const type = response.headers.get("content-type") ?? "";
-      if (type.includes("application/json")) {
-        return response.json();
-      }
-      return { boundary, html: await response.text() };
-    }
-
     function contextFor(matched, navigation) {
       return {
         params: matched.params,
@@ -4377,6 +4354,19 @@ const __routerModule = (() => {
       }
     }
 
+    function handleNavigation(promise) {
+      void promise.catch((error) => {
+        if (destroyed) {
+          return;
+        }
+        setRouterState({
+          pending: false,
+          error
+        });
+        dispatchAsyncError(rootNode, error);
+      });
+    }
+
     function currentUrl() {
       return resolveUrl(documentRef.defaultView?.location?.href ?? "http://localhost/");
     }
@@ -4393,6 +4383,33 @@ const __routerModule = (() => {
         throw new Error("Router has been destroyed.");
       }
     }
+
+    function shouldIgnoreLink(event, anchor) {
+      if (event.defaultPrevented || event.metaKey || event.ctrlKey || event.shiftKey || event.altKey) {
+        return true;
+      }
+      if (anchor.target || anchor.hasAttribute("download")) {
+        return true;
+      }
+      const target = resolveUrl(anchor.href);
+      const current = currentUrl();
+      if (target.origin !== current.origin) {
+        return true;
+      }
+      return isHashOnlyNavigation(target, current, anchor);
+    }
+
+    function shouldIgnoreForm(form) {
+      const method = String(form.method || "get").toLowerCase();
+      return method !== "get" || resolveUrl(form.action).origin !== currentUrl().origin;
+    }
+
+    function formActionUrl(form) {
+      const url = resolveUrl(form.action || form.ownerDocument.defaultView.location.href);
+      const formData = new form.ownerDocument.defaultView.FormData(form);
+      url.search = new URLSearchParams(formData).toString();
+      return url.href;
+    }
   }
 
   function normalizeRoute(pattern, definition) {
@@ -4430,28 +4447,6 @@ const __routerModule = (() => {
     return { regex: new RegExp(`^${source}$`), keys };
   }
 
-  function shouldIgnoreLink(event, anchor) {
-    if (event.defaultPrevented || event.metaKey || event.ctrlKey || event.shiftKey || event.altKey) {
-      return true;
-    }
-    if (anchor.target || anchor.hasAttribute("download")) {
-      return true;
-    }
-    return toUrl(anchor.href).origin !== toUrl(anchor.ownerDocument.defaultView.location.href).origin;
-  }
-
-  function shouldIgnoreForm(form) {
-    const method = String(form.method || "get").toLowerCase();
-    return method !== "get" || toUrl(form.action).origin !== toUrl(form.ownerDocument.defaultView.location.href).origin;
-  }
-
-  function formActionUrl(form) {
-    const url = toUrl(form.action || form.ownerDocument.defaultView.location.href);
-    const formData = new form.ownerDocument.defaultView.FormData(form);
-    url.search = new URLSearchParams(formData).toString();
-    return url.href;
-  }
-
   function closest(target, selector) {
     return target?.closest?.(selector);
   }
@@ -4467,6 +4462,40 @@ const __routerModule = (() => {
     return Object.fromEntries(url.searchParams.entries());
   }
 
+  function safeDecodeURIComponent(value) {
+    try {
+      return decodeURIComponent(value);
+    } catch {
+      return value;
+    }
+  }
+
+  function isHashOnlyNavigation(target, current, anchor) {
+    if (target.origin !== current.origin || target.pathname !== current.pathname || target.search !== current.search) {
+      return false;
+    }
+    return target.hash !== current.hash || anchor.getAttribute?.("href")?.startsWith("#") === true;
+  }
+
+  function assertRouterMode(mode) {
+    if (!routerModes.has(mode)) {
+      throw new TypeError(`Unknown router mode "${mode}".`);
+    }
+  }
+
+  function dispatchAsyncError(element, error) {
+    const EventCtor = element.ownerDocument?.defaultView?.CustomEvent ?? globalThis.CustomEvent;
+    if (typeof EventCtor !== "function") {
+      return;
+    }
+    element.dispatchEvent?.(
+      new EventCtor("async:error", {
+        bubbles: true,
+        detail: { error }
+      })
+    );
+  }
+
   function escapeRegExp(value) {
     return String(value).replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
   }
@@ -4852,7 +4881,7 @@ const __appModule = (() => {
         return;
       }
       router = router ?? createRouter({
-        mode: options.mode ?? "ssr-spa",
+        mode: options.mode ?? "ssr",
         root,
         boundary: options.boundary ?? "route",
         routes,
@@ -4863,8 +4892,6 @@ const __appModule = (() => {
         cache: browserCache,
         partials,
         scheduler,
-        fetch: options.fetch,
-        routeEndpoint: options.routeEndpoint,
         attributes
       });
       runtime.router = router;