@solidjs/start 2.0.0-beta.0 → 2.0.0-beta.2

package/src/server/collect-styles.ts

@@ -1,70 +0,0 @@
-import path from "node:path";
-import type { DevEnvironment, EnvironmentModuleNode } from "vite";
-
-async function getViteModuleNode(vite: DevEnvironment, file: string, importer?: string) {
-  try {
-    const res = await vite.fetchModule(file, importer);
-    if (!("id" in res)) return;
-    return vite.moduleGraph.getModuleById(res.id);
-  } catch (err) {}
-}
-
-async function findModuleDependencies(
-  vite: DevEnvironment,
-  file: string,
-  deps: Set<EnvironmentModuleNode>,
-  crawledFiles = new Set<string>(),
-  importer?: string,
-) {
-  crawledFiles.add(file);
-  const module = await getViteModuleNode(vite, file, importer);
-  if (!module?.id || deps.has(module)) return;
-
-  deps.add(module);
-
-  if (module.url.endsWith(".css") || module.url.includes("node_modules")) return;
-
-  if (!module.transformResult) {
-    await vite.transformRequest(module.id).catch(() => {});
-  }
-  if (!module.transformResult?.deps) return;
-
-  // Relying on module.transformResult.deps instead of module.importedModules because:
-  // transformResult properly separates imports into deps and dynamicDeps, importedModules doesn't
-  // Style crawling has to skip dynamic imports as such modules load their styles themselves
-  for (const dep of module.transformResult.deps) {
-    if (crawledFiles.has(dep)) {
-      continue;
-    }
-    await findModuleDependencies(vite, dep, deps, crawledFiles, module.id);
-  }
-}
-
-// Vite doesn't expose these so we just copy the list for now
-// https://github.com/vitejs/vite/blob/d6bde8b03d433778aaed62afc2be0630c8131908/packages/vite/src/node/constants.ts#L49C23-L50
-const cssFileRegExp = /\.(css|less|sass|scss|styl|stylus|pcss|postcss|sss)$/;
-// https://github.com/vitejs/vite/blob/d6bde8b03d433778aaed62afc2be0630c8131908/packages/vite/src/node/plugins/css.ts#L160
-const cssModulesRegExp = new RegExp(`\\.module${cssFileRegExp.source}`);
-
-const isCssFile = (file: string) => cssFileRegExp.test(file);
-export const isCssModulesFile = (file: string) => cssModulesRegExp.test(file);
-
-export async function findStylesInModuleGraph(vite: DevEnvironment, id: string) {
-  const absolute = path.resolve(process.cwd(), id);
-  const dependencies = new Set<EnvironmentModuleNode>();
-
-  try {
-    await findModuleDependencies(vite, absolute, dependencies);
-  } catch (e) {
-    console.error(e);
-  }
-
-  const styles: Record<string, any> = {};
-  for (const dep of dependencies) {
-    if (dep.id && isCssFile(dep.url)) {
-      styles[dep.id] = dep.url;
-    }
-  }
-
-  return styles;
-}

package/src/server/fetchEvent.spec.ts

@@ -1,85 +0,0 @@
-import * as h3 from "h3";
-import { beforeEach, describe, expect, it, vi } from "vitest";
-
-import { createFetchEvent, getFetchEvent, mergeResponseHeaders } from "./fetchEvent.ts";
-
-vi.mock(import("h3"), async mod => {
-  return {
-    ...(await mod()),
-    getRequestIP: vi.fn(),
-  };
-});
-
-const mockedH3 = vi.mocked(h3);
-
-const createMockH3Event = (): h3.H3Event => {
-  const event = new h3.H3Event(new Request("http://localhost/test"));
-
-  event.res.status = 200;
-  event.res.statusText = "OK";
-
-  return event;
-};
-
-describe("fetchEvent", () => {
-  let mockH3Event: h3.H3Event;
-
-  beforeEach(() => {
-    mockH3Event = createMockH3Event();
-    vi.clearAllMocks();
-
-    mockedH3.getRequestIP.mockReturnValue("127.0.0.1");
-  });
-
-  describe("createFetchEvent", () => {
-    it("should create a FetchEvent from H3Event", () => {
-      const fetchEvent = createFetchEvent(mockH3Event);
-
-      expect(fetchEvent).toEqual({
-        request: mockH3Event.req,
-        response: expect.any(Object),
-        clientAddress: "127.0.0.1",
-        locals: {},
-        nativeEvent: mockH3Event,
-      });
-    });
-
-    it("should create response stub with correct properties", () => {
-      const fetchEvent = createFetchEvent(mockH3Event);
-
-      expect(fetchEvent.response).toHaveProperty("status");
-      expect(fetchEvent.response).toHaveProperty("statusText");
-      expect(fetchEvent.response).toHaveProperty("headers");
-    });
-  });
-
-  describe("getFetchEvent", () => {
-    it("should create and cache FetchEvent on first call", () => {
-      const fetchEvent = getFetchEvent(mockH3Event);
-
-      expect(mockH3Event.context.solidFetchEvent).toBe(fetchEvent);
-      expect(fetchEvent.nativeEvent).toBe(mockH3Event);
-    });
-
-    it("should return cached FetchEvent on subsequent calls", () => {
-      const firstCall = getFetchEvent(mockH3Event);
-      const secondCall = getFetchEvent(mockH3Event);
-
-      expect(firstCall).toBe(secondCall);
-    });
-  });
-
-  describe("mergeResponseHeaders", () => {
-    it("should merge headers from Headers object to H3Event", () => {
-      const headers = new Headers({
-        "content-type": "application/json",
-        "x-custom": "value",
-      });
-
-      mergeResponseHeaders(mockH3Event, headers);
-
-      expect(headers.get("content-type")).toBe("application/json");
-      expect(headers.get("x-custom")).toBe("value");
-    });
-  });
-});

package/src/server/fetchEvent.ts

@@ -1,36 +0,0 @@
-import { type EventHandler, getRequestIP, type H3Event, type Middleware } from "h3";
-import { provideRequestEvent } from "solid-js/web/storage";
-import type { FetchEvent } from "./types.ts";
-
-const FETCH_EVENT_CONTEXT = "solidFetchEvent";
-
-export function createFetchEvent(event: H3Event): FetchEvent {
-  return {
-    request: event.req,
-    response: event.res,
-    clientAddress: getRequestIP(event),
-    locals: {},
-    nativeEvent: event,
-  };
-}
-
-export function getFetchEvent(h3Event: H3Event): FetchEvent {
-  if (!h3Event.context[FETCH_EVENT_CONTEXT]) {
-    const fetchEvent = createFetchEvent(h3Event);
-    h3Event.context[FETCH_EVENT_CONTEXT] = fetchEvent;
-  }
-
-  return h3Event.context[FETCH_EVENT_CONTEXT] as any;
-}
-
-export function mergeResponseHeaders(h3Event: H3Event, headers: Headers) {
-  for (const [key, value] of headers.entries()) {
-    h3Event.res.headers.append(key, value);
-  }
-}
-
-export const decorateHandler = <T extends EventHandler>(fn: T) =>
-  (event => provideRequestEvent(getFetchEvent(event), () => fn(event))) as T;
-
-export const decorateMiddleware = <T extends Middleware>(fn: T) =>
-  ((event, next) => provideRequestEvent(getFetchEvent(event), () => fn(event, next))) as T;

package/src/server/handler.ts

@@ -1,261 +0,0 @@
-import middleware from "solid-start:middleware";
-import { defineHandler, getCookie, H3, type H3Event, redirect, setCookie } from "h3/generic";
-import { join } from "pathe";
-import type { JSX } from "solid-js";
-import { sharedConfig } from "solid-js";
-import { getRequestEvent, renderToStream, renderToString } from "solid-js/web";
-
-import { createRoutes } from "../router.tsx";
-import { decorateHandler, decorateMiddleware } from "./fetchEvent.ts";
-import { getSsrManifest } from "./manifest/ssr-manifest.ts";
-import { matchAPIRoute } from "./routes.ts";
-import { handleServerFunction } from "../fns/handler.ts";
-import type { APIEvent, FetchEvent, HandlerOptions, PageEvent } from "./types.ts";
-import { getExpectedRedirectStatus } from "./util.ts";
-
-const SERVER_FN_BASE = "/_server";
-
-export function createBaseHandler(
-  createPageEvent: (e: FetchEvent) => Promise<PageEvent>,
-  fn: (context: PageEvent) => JSX.Element,
-  options: HandlerOptions | ((context: PageEvent) => HandlerOptions | Promise<HandlerOptions>) = {},
-) {
-  const handler = defineHandler({
-    middleware: middleware.length ? middleware.map(decorateMiddleware) : undefined,
-    handler: decorateHandler(async (e: H3Event) => {
-      const event = getRequestEvent()!;
-      const url = new URL(event.request.url);
-      const pathname = stripBaseUrl(url.pathname);
-
-      if (pathname.startsWith(SERVER_FN_BASE)) {
-        const serverFnResponse = await handleServerFunction(e);
-
-        if (serverFnResponse instanceof Response)
-          return produceResponseWithEventHeaders(serverFnResponse);
-
-        return new Response(serverFnResponse as any, {
-          headers: e.res.headers,
-        });
-      }
-
-      const match = matchAPIRoute(pathname, event.request.method);
-      if (match) {
-        const mod = await match.handler.import();
-        const fn =
-          event.request.method === "HEAD" ? mod["HEAD"] || mod["GET"] : mod[event.request.method];
-        if (typeof fn === "function") {
-          (event as APIEvent).params = match.params || {};
-          // @ts-expect-error
-          sharedConfig.context = { event };
-          const res = await fn(event);
-          if (res !== undefined) {
-            if (res instanceof Response) return produceResponseWithEventHeaders(res);
-
-            return res;
-          }
-          if (event.request.method !== "GET") {
-            throw new Error(
-              `API handler for ${event.request.method} "${event.request.url}" did not return a response.`,
-            );
-          }
-          if (!match.isPage) return;
-        }
-      }
-
-      const context = await createPageEvent(event);
-
-      const resolvedOptions =
-        typeof options === "function" ? await options(context) : { ...options };
-      const mode = resolvedOptions.mode || "stream";
-      if (resolvedOptions.nonce) context.nonce = resolvedOptions.nonce;
-
-      if (mode === "sync" || !import.meta.env.START_SSR) {
-        const html = renderToString(() => {
-          (sharedConfig.context as any).event = context;
-          return fn(context);
-        }, resolvedOptions);
-        context.complete = true;
-
-        if (context.response && context.response.headers.get("Location")) {
-          const status = getExpectedRedirectStatus(context.response);
-          return redirect(context.response.headers.get("Location")!, status);
-        }
-
-        event.response.headers.set("content-type", "text/html");
-
-        return html;
-      }
-
-      if (resolvedOptions.onCompleteAll) {
-        const og = resolvedOptions.onCompleteAll;
-        resolvedOptions.onCompleteAll = options => {
-          handleStreamCompleteRedirect(context)(options);
-          og(options);
-        };
-      } else resolvedOptions.onCompleteAll = handleStreamCompleteRedirect(context);
-      if (resolvedOptions.onCompleteShell) {
-        const og = resolvedOptions.onCompleteShell;
-        resolvedOptions.onCompleteShell = options => {
-          handleShellCompleteRedirect(context, e)();
-          og(options);
-        };
-      } else resolvedOptions.onCompleteShell = handleShellCompleteRedirect(context, e);
-
-      const _stream = renderToStream(() => {
-        (sharedConfig.context as any).event = context;
-        return fn(context);
-      }, resolvedOptions);
-      const stream = _stream as typeof _stream & PromiseLike<string>; // stream has a hidden 'then' method
-
-      if (context.response && context.response.headers.get("Location")) {
-        const status = getExpectedRedirectStatus(context.response);
-        return redirect(context.response.headers.get("Location")!, status);
-      }
-
-      if (mode === "async") return await stream;
-
-      delete (stream as any).then;
-
-      // using TransformStream in dev can cause solid-start-dev-server to crash
-      // when stream is cancelled
-      if (globalThis.USING_SOLID_START_DEV_SERVER) return stream;
-
-      // returning stream directly breaks cloudflare workers
-      const { writable, readable } = new TransformStream();
-      stream.pipeTo(writable);
-      return readable;
-    }),
-  });
-
-  const app = new H3();
-
-  app.use(handler);
-
-  return app;
-}
-
-export function createHandler(
-  fn: (context: PageEvent) => JSX.Element,
-  options: HandlerOptions | ((context: PageEvent) => HandlerOptions | Promise<HandlerOptions>) = {},
-) {
-  return createBaseHandler(createPageEvent, fn, options);
-}
-
-export async function createPageEvent(ctx: FetchEvent) {
-  ctx.response.headers.set("Content-Type", "text/html");
-  // const prevPath = ctx.request.headers.get("x-solid-referrer");
-  // const mutation = ctx.request.headers.get("x-solid-mutation") === "true";
-  const manifest = getSsrManifest(import.meta.env.SSR && import.meta.env.DEV ? "ssr" : "client");
-
-  // Handle Vite build.cssCodeSplit
-  // When build.cssCodeSplit is false, a single CSS file is generated with the key style.css
-  const mergedCSS = import.meta.env.PROD ? await manifest.getAssets("style.css") : [];
-
-  const assets = [
-    ...mergedCSS,
-    ...(await manifest.getAssets(import.meta.env.START_CLIENT_ENTRY)),
-    ...(await manifest.getAssets(import.meta.env.START_APP_ENTRY)),
-    // ...(import.meta.env.START_ISLANDS
-    //   ? (await serverManifest.inputs[serverManifest.handler]!.assets()).filter(
-    //       s => (s as any).attrs.rel !== "modulepreload"
-    //     )
-    //   : [])
-  ];
-  const pageEvent: PageEvent = Object.assign(ctx, {
-    assets,
-    router: {
-      submission: initFromFlash(ctx) as any,
-    },
-    routes: createRoutes(),
-    // prevUrl: prevPath || "",
-    // mutation: mutation,
-    // $type: FETCH_EVENT,
-    complete: false,
-    $islands: new Set<string>(),
-  });
-
-  return pageEvent;
-}
-
-function initFromFlash(ctx: FetchEvent) {
-  const flash = getCookie(ctx.nativeEvent, "flash");
-  if (!flash) return;
-  try {
-    const param = JSON.parse(flash);
-    if (!param || !param.result) return;
-    const input = [...param.input.slice(0, -1), new Map(param.input[param.input.length - 1])];
-    const result = param.error ? new Error(param.result) : param.result;
-    return {
-      input,
-      url: param.url,
-      pending: false,
-      result: param.thrown ? undefined : result,
-      error: param.thrown ? result : undefined,
-    };
-  } catch (e) {
-    console.error(e);
-  } finally {
-    setCookie(ctx.nativeEvent, "flash", "", { maxAge: 0 });
-  }
-}
-
-function handleShellCompleteRedirect(context: PageEvent, e: H3Event) {
-  return () => {
-    if (context.response && context.response.headers.get("Location")) {
-      const status = getExpectedRedirectStatus(context.response);
-      e.res.status = status;
-      e.res.headers.set("Location", context.response.headers.get("Location")!);
-    }
-  };
-}
-
-function handleStreamCompleteRedirect(context: PageEvent) {
-  return ({ write }: { write: (html: string) => void }) => {
-    context.complete = true;
-    const to = context.response && context.response.headers.get("Location");
-    to && write(`<script>window.location=${JSON.stringify(to).replace(/</g, "\\u003c")}</script>`);
-  };
-}
-
-function produceResponseWithEventHeaders(res: Response) {
-  const event = getRequestEvent()!;
-
-  let ret = res;
-
-  // Response.redirect returns an immutable value, so we clone on any redirect just in case
-  if (300 <= res.status && res.status < 400) {
-    const cookies = res.headers.getSetCookie?.() ?? [];
-    const headers = new Headers();
-    res.headers.forEach((value, key) => {
-      if (key.toLowerCase() !== "set-cookie") {
-        headers.set(key, value);
-      }
-    });
-    for (const cookie of cookies) {
-      headers.append("Set-Cookie", cookie);
-    }
-    ret = new Response(res.body, {
-      status: res.status,
-      statusText: res.statusText,
-      headers,
-    });
-  }
-
-  const eventCookies = event.response.headers.getSetCookie?.() ?? [];
-  for (const cookie of eventCookies) {
-    ret.headers.append("Set-Cookie", cookie);
-  }
-
-  for (const [name, value] of event.response.headers) {
-    if (name.toLowerCase() !== "set-cookie") {
-      ret.headers.set(name, value);
-    }
-  }
-
-  return ret;
-}
-
-function stripBaseUrl(path: string) {
-  if (import.meta.env.BASE_URL === "/" || import.meta.env.BASE_URL === "") return path;
-  return path.slice(import.meta.env.BASE_URL.length);
-}

package/src/server/index.tsx

@@ -1,29 +0,0 @@
-export { default as lazy } from "../shared/lazy.ts";
-export { getServerFunctionMeta } from "../shared/serverFunction.ts";
-export { StartServer } from "./StartServer.tsx";
-export { createHandler } from "./handler.ts";
-
-export type {
-  APIEvent,
-  APIHandler,
-  Asset,
-  ContextMatches,
-  DocumentComponentProps,
-  FetchEvent,
-  HandlerOptions,
-  PageEvent,
-  ResponseStub,
-  ServerFunctionMeta,
-} from "./types.ts";
-
-/**
- * Checks if user has set a redirect status in the response.
- * If not, falls back to the 302 (temporary redirect)
- */
-// export function getExpectedRedirectStatus(response: ResponseStub): number {
-//   if (response.status && validRedirectStatuses.has(response.status)) {
-//     return response.status;
-//   }
-
-//   return 302;
-// }

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

@@ -1,8 +0,0 @@
-import { getClientDevManifest } from "./dev-client-manifest.ts";
-import { getClientProdManifest } from "./prod-client-manifest.ts";
-
-export function getClientManifest() {
-  return import.meta.env.DEV ? getClientDevManifest() : getClientProdManifest();
-}
-
-export { getClientManifest as getManifest };

package/src/server/manifest/dev-client-manifest.ts

@@ -1,21 +0,0 @@
-import { join } from "pathe";
-
-export function getClientDevManifest() {
-  return {
-    import(id) {
-      return import(/* @vite-ignore */ join("/", id));
-    },
-    async getAssets(id) {
-      const assetsPath = `/@manifest/client/${Date.now()}/assets?id=${id}`;
-
-      const assets = (await import(/* @vite-ignore */ assetsPath)).default;
-
-      return await Promise.all(
-        assets.map(async (v: any) => ({
-          ...v,
-          children: await v.children(),
-        })),
-      );
-    },
-  } satisfies StartManifest & { import(id: string): Promise<any> };
-}

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

@@ -1,23 +0,0 @@
-import { join, normalize } from "pathe";
-
-export function getSsrDevManifest(environment: "client" | "ssr") {
-  return {
-    path: (id: string) => normalize(join(import.meta.env.BASE_URL, id)),
-    async getAssets(id) {
-      const assetsPath = `/@manifest/${environment}/${Date.now()}/assets?id=${id}`;
-
-      const assets = (await import(/* @vite-ignore */ assetsPath)).default;
-
-      return await Promise.all(
-        assets.map(async (v: any) => ({
-          ...v,
-          children: await v.children(),
-        })),
-      );
-    },
-  } satisfies StartManifest & {
-    path(id: string): string;
-  };
-}
-
-export { getSsrDevManifest as getSsrManifest };

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

@@ -1,21 +0,0 @@
-export function getClientProdManifest() {
-  return {
-    import(id) {
-      // @ts-ignore
-      return import(/* @vite-ignore */ window.manifest[id].output);
-    },
-    async getAssets(id) {
-      if (id.startsWith("./")) id = id.slice(2);
-
-      // @ts-ignore
-      return window.manifest[id]?.assets ?? [];
-    },
-    async json() {
-      // @ts-ignore
-      return window.manifest;
-    },
-  } satisfies StartManifest & {
-    json(): Promise<Record<string, any>>;
-    import(id: string): Promise<any>;
-  };
-}

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

@@ -1,109 +0,0 @@
-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

@@ -1,10 +0,0 @@
-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 };