@solidjs/start 1.2.1 → 2.0.0-alpha.1

package/src/server/manifest/prod-ssr-manifest.ts

@@ -0,0 +1,109 @@
+import { clientViteManifest } from "solid-start:client-vite-manifest";
+import { join } from "pathe";
+import { Manifest } from "vite";
+import type { Asset } from "../assets/render.tsx";
+
+// Only reads from client manifest atm, might need server support for islands
+export function getSsrProdManifest() {
+  const viteManifest = clientViteManifest;
+  return {
+    path(id: string) {
+      if (id.startsWith("./")) id = id.slice(2);
+
+      const viteManifestEntry = clientViteManifest[id /*import.meta.env.START_CLIENT_ENTRY*/];
+      if (!viteManifestEntry) throw new Error(`No entry found in vite manifest for '${id}'`);
+
+      return join("/", viteManifestEntry.file);
+    },
+    async getAssets(id) {
+      if (id.startsWith("./")) id = id.slice(2);
+
+      return createHtmlTagsForAssets(findAssetsInViteManifest(clientViteManifest, id));
+    },
+    async json() {
+      const json: Record<string, any> = {};
+
+      const entryKeys = Object.keys(viteManifest)
+        .filter(id => viteManifest[id]?.isEntry || viteManifest[id]?.isDynamicEntry)
+        .map(id => id);
+
+      for (const entryKey of entryKeys) {
+        json[entryKey] = {
+          output: join("/", viteManifest[entryKey]!.file),
+          assets: await this.getAssets(entryKey),
+        };
+      }
+
+      return json;
+    },
+  } satisfies StartManifest & {
+    json(): Promise<Record<string, any>>;
+    path(id: string): string;
+  };
+}
+
+function createHtmlTagsForAssets(assets: string[]) {
+  return assets
+    .filter(
+      asset =>
+        asset.endsWith(".css") ||
+        asset.endsWith(".js") ||
+        asset.endsWith(".ts") ||
+        asset.endsWith(".mjs"),
+    )
+    .map<Asset>(asset => ({
+      tag: "link",
+      attrs: {
+        href: "/" + asset,
+        key: asset,
+        ...(asset.endsWith(".css") ? { rel: "stylesheet" } : { rel: "modulepreload" }),
+      },
+    }));
+}
+
+const entryId = import.meta.env.START_CLIENT_ENTRY.slice(2);
+let entryImports: string[] | undefined = undefined;
+
+function findAssetsInViteManifest(
+  manifest: Manifest,
+  id: string,
+  assetMap = new Map(),
+  stack: string[] = [],
+) {
+  if (stack.includes(id)) {
+    return [];
+  }
+
+  const cached = assetMap.get(id);
+  if (cached) {
+    return cached;
+  }
+  const chunk = manifest[id];
+  if (!chunk) {
+    return [];
+  }
+
+  if (!entryImports) {
+    entryImports = [entryId, ...(manifest[entryId]?.imports ?? [])];
+  }
+
+  // Only include entry imports, if we are specifically crawling the entry
+  // Chunks (e.g. routes) that import something from entry, should not render entry css redundantly
+  const excludeEntryImports = id !== entryId;
+
+  const assets = chunk.css?.filter(Boolean) || [];
+  if (chunk.imports) {
+    stack.push(id);
+    for (let i = 0, l = chunk.imports.length; i < l; i++) {
+      const importId = chunk.imports[i];
+      if (!importId || (excludeEntryImports && entryImports.includes(importId))) continue;
+      assets.push(...findAssetsInViteManifest(manifest, importId, assetMap, stack));
+    }
+    stack.pop();
+  }
+  assets.push(chunk.file);
+  const all = Array.from(new Set(assets));
+  assetMap.set(id, all);
+
+  return all;
+}

package/src/server/manifest/ssr-manifest.ts

@@ -0,0 +1,10 @@
+import { getSsrDevManifest } from "./dev-ssr-manifest.ts";
+import { getSsrProdManifest } from "./prod-ssr-manifest.ts";
+
+export function getSsrManifest(
+  target: "client" | "ssr",
+): ReturnType<typeof getSsrDevManifest> | ReturnType<typeof getSsrProdManifest> {
+  return import.meta.env.DEV ? getSsrDevManifest(target) : getSsrProdManifest();
+}
+
+export { getSsrManifest as getManifest };

package/src/server/routes.ts

@@ -0,0 +1,126 @@
+// @ts-expect-error
+import fileRoutes from "solid-start:routes";
+import { createRouter } from "radix3";
+
+import type { FetchEvent } from "./types.ts";
+
+interface Route {
+  path: string;
+  id: string;
+  children?: Route[];
+  page?: boolean;
+  $component?: any;
+  $HEAD?: any;
+  $GET?: any;
+  $POST?: any;
+  $PUT?: any;
+  $PATCH?: any;
+  $DELETE?: any;
+}
+
+export const pageRoutes = defineRoutes((fileRoutes as unknown as Route[]).filter(o => o.page));
+
+function defineRoutes(fileRoutes: Route[]) {
+  function processRoute(routes: Route[], route: Route, id: string, full: string) {
+    const parentRoute = Object.values(routes).find(o => {
+      return id.startsWith(o.id + "/");
+    });
+
+    if (!parentRoute) {
+      routes.push({
+        ...route,
+        id,
+        path: id.replace(/\([^)/]+\)/g, "").replace(/\/+/g, "/"),
+      });
+      return routes;
+    }
+    processRoute(
+      parentRoute.children || (parentRoute.children = []),
+      route,
+      id.slice(parentRoute.id.length),
+      full,
+    );
+
+    return routes;
+  }
+
+  return fileRoutes
+    .sort((a, b) => a.path.length - b.path.length)
+    .reduce((prevRoutes: Route[], route) => {
+      return processRoute(prevRoutes, route, route.path, route.path);
+    }, []);
+}
+
+const router = createRouter({
+  routes: (fileRoutes as unknown as Route[]).reduce(
+    (memo, route) => {
+      if (!containsHTTP(route)) return memo;
+      const path = route.path
+        .replace(/\([^)/]+\)/g, "")
+        .replace(/\/+/g, "/")
+        .replace(/\*([^/]*)/g, (_, m) => `**:${m}`)
+        .split("/")
+        .map(s => (s.startsWith(":") || s.startsWith("*") ? s : encodeURIComponent(s)))
+        .join("/");
+      if (/:[^/]*\?/g.test(path)) {
+        throw new Error(`Optional parameters are not supported in API routes: ${path}`);
+      }
+      if (memo[path]) {
+        throw new Error(
+          `Duplicate API routes for "${path}" found at "${memo[path]!.route.path}" and "${
+            route.path
+          }"`,
+        );
+      }
+      memo[path] = { route };
+      return memo;
+    },
+    {} as Record<string, { route: Route }>,
+  ),
+});
+
+function containsHTTP(route: Route) {
+  return (
+    route["$HEAD"] ||
+    route["$GET"] ||
+    route["$POST"] ||
+    route["$PUT"] ||
+    route["$PATCH"] ||
+    route["$DELETE"]
+  );
+}
+
+export function matchAPIRoute(
+  path: string,
+  method: string,
+):
+  | {
+      params?: Record<string, any>;
+      handler: {
+        import: () => Promise<Record<string, (e: FetchEvent) => Promise<any>>>;
+      };
+      isPage: boolean;
+    }
+  | undefined {
+  const match = router.lookup(path);
+  if (match && match.route) {
+    const route = match.route;
+
+    // Find the appropriate handler for the HTTP method
+    const handler = method === "HEAD" ? route.$HEAD || route.$GET : route[`$${method}`];
+
+    if (handler === undefined) return;
+
+    // Check if this is a page route
+    const isPage = route.page === true && route.$component !== undefined;
+
+    // Return comprehensive route information
+    return {
+      handler,
+      params: match.params,
+      isPage,
+    };
+  }
+
+  return undefined;
+}

package/src/server/server-fns-runtime.ts

@@ -0,0 +1,31 @@
+import { getRequestEvent } from "solid-js/web";
+import { provideRequestEvent } from "solid-js/web/storage";
+
+export function createServerReference(fn: Function, id: string) {
+  if (typeof fn !== "function")
+    throw new Error("Export from a 'use server' module must be a function");
+  let baseURL = import.meta.env.BASE_URL ?? "/";
+  if (!baseURL.endsWith("/")) baseURL += "/";
+
+  return new Proxy(fn, {
+    get(target, prop, receiver) {
+      if (prop === "url") {
+        return `${baseURL}_server?id=${encodeURIComponent(id)}`;
+      }
+      if (prop === "GET") return receiver;
+      return (target as any)[prop];
+    },
+    apply(target, thisArg, args) {
+      const ogEvt = getRequestEvent();
+      if (!ogEvt) throw new Error("Cannot call server function outside of a request");
+      const evt = { ...ogEvt };
+      evt.locals.serverFunctionMeta = {
+        id,
+      };
+      evt.serverOnly = true;
+      return provideRequestEvent(evt, () => {
+        return fn.apply(thisArg, args);
+      });
+    },
+  });
+}

package/src/server/server-functions-handler.ts

@@ -0,0 +1,339 @@
+import { getServerFnById } from "solidstart:server-fn-manifest";
+import { parseSetCookie } from "cookie-es";
+import { type H3Event, parseCookies } from "h3";
+import { crossSerializeStream, fromJSON, getCrossReferenceHeader } from "seroval";
+import {
+  CustomEventPlugin,
+  DOMExceptionPlugin,
+  EventPlugin,
+  FormDataPlugin,
+  HeadersPlugin,
+  ReadableStreamPlugin,
+  RequestPlugin,
+  ResponsePlugin,
+  URLPlugin,
+  URLSearchParamsPlugin,
+} from "seroval-plugins/web";
+import { sharedConfig } from "solid-js";
+import { renderToString } from "solid-js/web";
+import { provideRequestEvent } from "solid-js/web/storage";
+
+import { getFetchEvent, mergeResponseHeaders } from "./fetchEvent.ts";
+import { createPageEvent } from "./handler.ts";
+import type { FetchEvent, PageEvent } from "./types.ts";
+import { getExpectedRedirectStatus } from "./util.ts";
+
+function createChunk(data: string) {
+  const encodeData = new TextEncoder().encode(data);
+  const bytes = encodeData.length;
+  const baseHex = bytes.toString(16);
+  const totalHex = "00000000".substring(0, 8 - baseHex.length) + baseHex; // 32-bit
+  const head = new TextEncoder().encode(`;0x${totalHex};`);
+
+  const chunk = new Uint8Array(12 + bytes);
+  chunk.set(head);
+  chunk.set(encodeData, 12);
+  return chunk;
+}
+
+function serializeToStream(id: string, value: any) {
+  return new ReadableStream({
+    start(controller) {
+      crossSerializeStream(value, {
+        scopeId: id,
+        plugins: [
+          CustomEventPlugin,
+          DOMExceptionPlugin,
+          EventPlugin,
+          FormDataPlugin,
+          HeadersPlugin,
+          ReadableStreamPlugin,
+          RequestPlugin,
+          ResponsePlugin,
+          URLSearchParamsPlugin,
+          URLPlugin,
+        ],
+        onSerialize(data: string, initial: boolean) {
+          controller.enqueue(
+            createChunk(initial ? `(${getCrossReferenceHeader(id)},${data})` : data),
+          );
+        },
+        onDone() {
+          controller.close();
+        },
+        onError(error: any) {
+          controller.error(error);
+        },
+      });
+    },
+  });
+}
+
+export async function handleServerFunction(h3Event: H3Event) {
+  const event = getFetchEvent(h3Event);
+  const request = event.request;
+
+  const serverReference = request.headers.get("X-Server-Id");
+  const instance = request.headers.get("X-Server-Instance");
+  const singleFlight = request.headers.has("X-Single-Flight");
+  const url = new URL(request.url);
+  let functionId: string | undefined | null;
+  if (serverReference) {
+    // invariant(typeof serverReference === "string", "Invalid server function");
+    [functionId] = serverReference.split("#");
+  } else {
+    functionId = url.searchParams.get("id");
+
+    if (!functionId) {
+      return process.env.NODE_ENV === "development"
+        ? new Response("Server function not found", { status: 404 })
+        : new Response(null, { status: 404 });
+    }
+  }
+
+  const serverFunction = await getServerFnById(functionId!);
+
+  let parsed: any[] = [];
+
+  // grab bound arguments from url when no JS
+  if (!instance || h3Event.method === "GET") {
+    const args = url.searchParams.get("args");
+    if (args) {
+      const json = JSON.parse(args);
+      (json.t
+        ? (fromJSON(json, {
+            plugins: [
+              CustomEventPlugin,
+              DOMExceptionPlugin,
+              EventPlugin,
+              FormDataPlugin,
+              HeadersPlugin,
+              ReadableStreamPlugin,
+              RequestPlugin,
+              ResponsePlugin,
+              URLSearchParamsPlugin,
+              URLPlugin,
+            ],
+          }) as any)
+        : json
+      ).forEach((arg: any) => {
+        parsed.push(arg);
+      });
+    }
+  }
+  if (h3Event.method === "POST") {
+    const contentType = request.headers.get("content-type");
+
+    if (
+      contentType?.startsWith("multipart/form-data") ||
+      contentType?.startsWith("application/x-www-form-urlencoded")
+    ) {
+      parsed.push(await event.request.formData());
+    } else if (contentType?.startsWith("application/json")) {
+      parsed = fromJSON(await event.request.json(), {
+        plugins: [
+          CustomEventPlugin,
+          DOMExceptionPlugin,
+          EventPlugin,
+          FormDataPlugin,
+          HeadersPlugin,
+          ReadableStreamPlugin,
+          RequestPlugin,
+          ResponsePlugin,
+          URLSearchParamsPlugin,
+          URLPlugin,
+        ],
+      });
+    }
+  }
+  try {
+    let result = await provideRequestEvent(event, async () => {
+      /* @ts-expect-error */
+      sharedConfig.context = { event };
+      event.locals.serverFunctionMeta = {
+        id: functionId,
+      };
+      return serverFunction(...parsed);
+    });
+
+    if (singleFlight && instance) {
+      result = await handleSingleFlight(event, result);
+    }
+
+    // handle responses
+    if (result instanceof Response) {
+      if (result.headers && result.headers.has("X-Content-Raw")) return result;
+      if (instance) {
+        // forward headers
+        if (result.headers) mergeResponseHeaders(h3Event, result.headers);
+        // forward non-redirect statuses
+        if (result.status && (result.status < 300 || result.status >= 400))
+          h3Event.res.status = result.status;
+        if ((result as any).customBody) {
+          result = await (result as any).customBody();
+        } else if (result.body == undefined) result = null;
+      }
+    }
+
+    // handle no JS success case
+    if (!instance) return handleNoJS(result, request, parsed);
+
+    h3Event.res.headers.set("content-type", "text/javascript");
+
+    return serializeToStream(instance, result);
+  } catch (x) {
+    if (x instanceof Response) {
+      if (singleFlight && instance) {
+        x = await handleSingleFlight(event, x);
+      }
+      // forward headers
+      if ((x as any).headers) mergeResponseHeaders(h3Event, (x as any).headers);
+      // forward non-redirect statuses
+      if ((x as any).status && (!instance || (x as any).status < 300 || (x as any).status >= 400))
+        h3Event.res.status = (x as any).status;
+      if ((x as any).customBody) {
+        x = (x as any).customBody();
+      } else if ((x as any).body === undefined) x = null;
+      h3Event.res.headers.set("X-Error", "true");
+    } else if (instance) {
+      const error = x instanceof Error ? x.message : typeof x === "string" ? x : "true";
+
+      h3Event.res.headers.set("X-Error", error.replace(/[\r\n]+/g, ""));
+    } else {
+      x = handleNoJS(x, request, parsed, true);
+    }
+    if (instance) {
+      h3Event.res.headers.set("content-type", "text/javascript");
+      return serializeToStream(instance, x);
+    }
+    return x;
+  }
+}
+
+function handleNoJS(result: any, request: Request, parsed: any[], thrown?: boolean) {
+  const url = new URL(request.url);
+  const isError = result instanceof Error;
+  let statusCode = 302;
+  let headers: Headers;
+  if (result instanceof Response) {
+    headers = new Headers(result.headers);
+    if (result.headers.has("Location")) {
+      headers.set(
+        `Location`,
+        new URL(result.headers.get("Location")!, url.origin + import.meta.env.BASE_URL).toString(),
+      );
+      statusCode = getExpectedRedirectStatus(result);
+    }
+  } else
+    headers = new Headers({
+      Location: new URL(request.headers.get("referer")!).toString(),
+    });
+  if (result) {
+    headers.append(
+      "Set-Cookie",
+      `flash=${encodeURIComponent(
+        JSON.stringify({
+          url: url.pathname + url.search,
+          result: isError ? result.message : result,
+          thrown: thrown,
+          error: isError,
+          input: [...parsed.slice(0, -1), [...parsed[parsed.length - 1].entries()]],
+        }),
+      )}; Secure; HttpOnly;`,
+    );
+  }
+  return new Response(null, {
+    status: statusCode,
+    headers,
+  });
+}
+
+let App: any;
+function createSingleFlightHeaders(sourceEvent: FetchEvent) {
+  // cookie handling logic is pretty simplistic so this might be imperfect
+  // unclear if h3 internals are available on all platforms but we need a way to
+  // update request headers on the underlying H3 event.
+
+  const headers = sourceEvent.request.headers;
+  const cookies = parseCookies(sourceEvent.nativeEvent);
+  const SetCookies = sourceEvent.response.headers.getSetCookie();
+  headers.delete("cookie");
+  // let useH3Internals = false;
+  // if (sourceEvent.nativeEvent.node?.req) {
+  // 	useH3Internals = true;
+  // 	sourceEvent.nativeEvent.node.req.headers.cookie = "";
+  // }
+  SetCookies.forEach(cookie => {
+    if (!cookie) return;
+    const { maxAge, expires, name, value } = parseSetCookie(cookie);
+    if (maxAge != null && maxAge <= 0) {
+      delete cookies[name];
+      return;
+    }
+    if (expires != null && expires.getTime() <= Date.now()) {
+      delete cookies[name];
+      return;
+    }
+    cookies[name] = value;
+  });
+  Object.entries(cookies).forEach(([key, value]) => {
+    headers.append("cookie", `${key}=${value}`);
+    // useH3Internals &&
+    // 	(sourceEvent.nativeEvent.node.req.headers.cookie += `${key}=${value};`);
+  });
+
+  return headers;
+}
+async function handleSingleFlight(sourceEvent: FetchEvent, result: any): Promise<Response> {
+  let revalidate: string[];
+  let url = new URL(sourceEvent.request.headers.get("referer")!).toString();
+  if (result instanceof Response) {
+    if (result.headers.has("X-Revalidate"))
+      revalidate = result.headers.get("X-Revalidate")!.split(",");
+    if (result.headers.has("Location"))
+      url = new URL(
+        result.headers.get("Location")!,
+        new URL(sourceEvent.request.url).origin + import.meta.env.BASE_URL,
+      ).toString();
+  }
+  const event = { ...sourceEvent } as PageEvent;
+  event.request = new Request(url, {
+    headers: createSingleFlightHeaders(sourceEvent),
+  });
+  return await provideRequestEvent(event, async () => {
+    await createPageEvent(event);
+    App || (App = (await import("solid-start:app")).default);
+    /* @ts-expect-error */
+    event.router.dataOnly = revalidate || true;
+    /* @ts-expect-error */
+    event.router.previousUrl = sourceEvent.request.headers.get("referer");
+    try {
+      renderToString(() => {
+        /* @ts-expect-error */
+        sharedConfig.context.event = event;
+        App();
+      });
+    } catch (e) {
+      console.log(e);
+    }
+
+    /* @ts-expect-error */
+    const body = event.router.data;
+    if (!body) return result;
+    let containsKey = false;
+    for (const key in body) {
+      if (body[key] === undefined) delete body[key];
+      else containsKey = true;
+    }
+    if (!containsKey) return result;
+    if (!(result instanceof Response)) {
+      body["_$value"] = result;
+      result = new Response(null, { status: 200 });
+    } else if ((result as any).customBody) {
+      body["_$value"] = (result as any).customBody();
+    }
+    result.customBody = () => body;
+    result.headers.set("X-Single-Flight", "true");
+    return result;
+  });
+}