vite-plugin-react-server 1.2.0-alpha.1 → 1.2.0

package/plugin/helpers/handleServerActionHelper.ts

@@ -0,0 +1,270 @@
+import { logError, toError } from "../error/index.js";
+import { join } from "node:path";
+import type { Logger } from "vite";
+import type { ServerResponse } from "node:http";
+import type { IncomingMessage } from "node:http";
+
+export type ServerActionHandlerOptions = {
+  projectRoot: string;
+  verbose?: boolean;
+  logger?: Logger;
+  ssrLoadModule?: (path: string) => Promise<any>;
+};
+
+export type ServerActionRequest = {
+  id: string;
+  args: unknown[];
+};
+
+/**
+ * Parses a server action request from the request body.
+ * Supports two formats:
+ * 1. Direct args array: [arg1, arg2, ...]
+ * 2. Object with id and args: { id: string, args: unknown[] }
+ */
+export function parseServerActionRequestBody(body: string, url?: string): ServerActionRequest {
+  const parsed = JSON.parse(body);
+  
+  if (Array.isArray(parsed)) {
+    // Format 1: Direct args array
+    return {
+      args: parsed,
+      id: url?.split("?")[0] ?? "",
+    };
+  } else if (parsed && typeof parsed === "object" && "id" in parsed) {
+    // Format 2: Object with id and args
+    return {
+      id: parsed.id,
+      args: parsed.args ?? [],
+    };
+  }
+  
+  throw new Error("Invalid server action request format");
+}
+
+export type ServerActionResponse = {
+  type: "server-action-response";
+  returnValue: unknown;
+};
+
+/**
+ * Creates a server action response with the given result or error.
+ */
+export function createServerActionResponse(result?: unknown, error?: string): ServerActionResponse {
+  return {
+    type: "server-action-response",
+    returnValue: error 
+      ? { success: false, error }
+      : result
+  };
+}
+
+/**
+ * Sets up common response headers for server actions.
+ */
+export function setupServerActionHeaders(res: ServerResponse) {
+  res.setHeader("Content-Type", "text/x-component; charset=utf-8");
+  res.setHeader("Transfer-Encoding", "chunked");
+  res.setHeader("Connection", "keep-alive");
+}
+
+/**
+ * Parses a server action request from the request body and URL
+ */
+export async function parseServerActionRequest(
+  req: IncomingMessage,
+  verbose = false,
+  logger?: Logger
+): Promise<ServerActionRequest> {
+  // Get action ID from x-rsc-action header (preferred) or URL
+  let id = (req.headers["x-rsc-action"] as string) ?? req.url?.split("?")[0] ?? "";
+  
+  if (verbose) {
+    logger?.info(`[handleServerActionHelper] Parsing request at ${req.url}`);
+    logger?.info(`[handleServerActionHelper] Action ID from header: ${req.headers["x-rsc-action"]}`);
+  }
+
+  // Parse the request body
+  let args: unknown[];
+  try {
+    const chunks: Buffer[] = [];
+    for await (const chunk of req) {
+      chunks.push(chunk);
+    }
+    const body = Buffer.concat(chunks).toString();
+    
+    if (verbose) {
+      logger?.info(`[handleServerActionHelper] Request body length: ${body.length}`);
+    }
+
+    // Try to parse as JSON first (for backwards compatibility)
+    try {
+      const parsed = JSON.parse(body);
+      if (Array.isArray(parsed)) {
+        // Format 1: Direct args array
+        args = parsed;
+        if (verbose) {
+          logger?.info(`[handleServerActionHelper] Parsed args as array`);
+        }
+      } else if (parsed && typeof parsed === "object" && "id" in parsed) {
+        // Format 2: Object with id and args (legacy format)
+        id = parsed.id;
+        args = parsed.args ?? [];
+      } else {
+        throw new Error("Invalid server action request format");
+      }
+    } catch {
+      // Not JSON - assume it's React's encoded format
+      // For now, pass the raw body to the worker which can decode it
+      // using decodeReply from react-server-dom-esm/server
+      if (verbose) {
+        logger?.info(`[handleServerActionHelper] Body is not JSON, passing raw body`);
+      }
+      args = [body]; // Pass raw body as first arg, worker will decode
+    }
+  } catch (error: unknown) {
+    throw new Error(`Failed to parse server action request`, {
+      cause: error,
+    });
+  }
+
+  if (!id) {
+    throw new Error("Server action ID is required");
+  }
+
+  if (verbose) {
+    logger?.info(
+      `[handleServerActionHelper] Server action request for ${id} with args: ${JSON.stringify(args)}`
+    );
+  }
+
+  return { id, args };
+}
+
+/**
+ * Resolves a server action ID to file path and export name
+ */
+export function resolveServerAction(
+  id: string,
+  projectRoot: string,
+  verbose = false,
+  logger?: Logger
+): { filePath: string; exportName: string; fullPath: string } {
+  // Parse the server action ID to get the file path and export name
+  const [filePath, exportName] = id.split("#");
+  if (!filePath || !exportName) {
+    throw new Error(
+      `Invalid server action ID format: ${id}. Expected format: "path/to/file.ts#exportName"`
+    );
+  }
+
+  // Convert the server action ID to a file path
+  const actionPath = filePath.startsWith("/") ? filePath.slice(1) : filePath;
+  const fullPath = join(projectRoot, actionPath);
+  
+  if (verbose) {
+    logger?.info(
+      `[handleServerActionHelper] Resolved file path: id=${id}, actionPath=${actionPath}, projectRoot=${projectRoot}, filePath=${fullPath}, exportName=${exportName}`
+    );
+  }
+
+  return { filePath: actionPath, exportName, fullPath };
+}
+
+/**
+ * Loads and validates a server action from a module
+ */
+export async function loadServerAction(
+  fullPath: string,
+  exportName: string,
+  ssrLoadModule: (path: string) => Promise<any>,
+  verbose = false,
+  logger?: Logger
+): Promise<Function> {
+  if (verbose) {
+    logger?.info(`[handleServerActionHelper] Loading module: ${fullPath}`);
+  }
+  
+  const module = await ssrLoadModule(fullPath);
+  
+  if (verbose) {
+    logger?.info(
+      `[handleServerActionHelper] Looking for action: ${exportName} in module with exports: ${Object.keys(module).join(", ")}`
+    );
+  }
+  
+  const action = module[exportName];
+
+  if (typeof action !== "function") {
+    if (verbose) {
+      logger?.info(
+        `[handleServerActionHelper] Export ${exportName} is not a function: ${typeof action}`
+      );
+    }
+    throw new Error(
+      `Server action ${exportName} is not a function. Found: ${typeof action}`
+    );
+  }
+
+  return action;
+}
+
+/**
+ * Executes a server action with the given arguments
+ */
+export async function executeServerAction(
+  action: Function,
+  args: unknown[],
+  verbose = false,
+  logger?: Logger
+): Promise<unknown> {
+  if (verbose) {
+    logger?.info(`[handleServerActionHelper] Executing action with args: ${JSON.stringify(args)}`);
+  }
+
+  const result = await action(...args);
+  
+  if (verbose) {
+    logger?.info(`[handleServerActionHelper] Action executed successfully: ${JSON.stringify(result)}`);
+  }
+
+  return result;
+}
+
+/**
+ * Sends a server action response
+ */
+export function sendServerActionResponse(
+  res: ServerResponse,
+  result: unknown,
+  verbose = false,
+  logger?: Logger
+): void {
+  if (verbose) {
+    logger?.info(`[handleServerActionHelper] Sending response: ${JSON.stringify(result)}`);
+  }
+
+  // Send in RSC wire format for createFromFetch compatibility
+  res.setHeader("Content-Type", "text/x-component");
+  res.end(`0:${JSON.stringify(result)}\n`);
+}
+
+/**
+ * Handles server action errors
+ */
+export function handleServerActionError(
+  error: unknown,
+  res: ServerResponse,
+  logger?: Logger
+): void {
+  const err = toError(error);
+  logError(err, logger);
+  
+  res.statusCode = 500;
+  res.setHeader("Content-Type", "application/json");
+  res.end(JSON.stringify({ 
+    success: false, 
+    error: err.message,
+    stack: err.stack 
+  }));
+} 

package/plugin/helpers/headlessStreamReuseHandler.ts

@@ -0,0 +1,48 @@
+// No imports needed for this function
+
+/**
+ * Creates a Page component that reuses elements from a headless stream
+ */
+export function createHeadlessReusePageComponent({
+  reuseHeadlessStreamId,
+  headlessStreamElements,
+  headlessStreamErrors,
+  route,
+  verbose,
+  logger,
+}: {
+  reuseHeadlessStreamId: string;
+  headlessStreamElements: Map<string, any>;
+  headlessStreamErrors: Map<string, any>;
+  route: string;
+  verbose: boolean;
+  logger: any;
+}): (() => any) | undefined {
+  if (verbose) {
+    logger?.info(`[headlessStreamReuseHandler] Looking for reusable elements for stream ${reuseHeadlessStreamId}`);
+  }
+
+  // Check if the headless stream had errors
+  if (headlessStreamErrors.has(route)) {
+    if (verbose) {
+      logger?.info(`[headlessStreamReuseHandler] Headless stream had errors for route ${route}, not reusing`);
+    }
+    return undefined;
+  }
+
+  // Look for the reusable elements
+  const reusableElements = headlessStreamElements.get(reuseHeadlessStreamId);
+  if (!reusableElements) {
+    if (verbose) {
+      logger?.info(`[headlessStreamReuseHandler] No reusable elements found for stream ${reuseHeadlessStreamId}`);
+    }
+    return undefined;
+  }
+
+  if (verbose) {
+    logger?.info(`[headlessStreamReuseHandler] Found reusable elements for stream ${reuseHeadlessStreamId}`);
+  }
+
+  // Return a function that returns the stored elements
+  return () => reusableElements.elements;
+}

package/plugin/helpers/headlessStreamState.ts

@@ -0,0 +1,122 @@
+/**
+ * Manages headless stream state for error tracking and element reuse.
+ * Used by both client and server workflows for consistent behavior.
+ */
+
+export interface HeadlessStreamData {
+  PageComponent: any;
+  errored: boolean;
+}
+
+export interface HeadlessStreamState {
+  elements: Map<string, HeadlessStreamData>;
+  errors: Map<string, Error>;
+}
+
+/**
+ * Creates a new headless stream state manager.
+ */
+export function createHeadlessStreamState(): HeadlessStreamState {
+  return {
+    elements: new Map<string, HeadlessStreamData>(),
+    errors: new Map<string, Error>(),
+  };
+}
+
+/**
+ * Tracks a headless stream error for a route.
+ * 
+ * @param state - The headless stream state
+ * @param route - The route that had an error
+ * @param error - The error that occurred
+ */
+export function trackHeadlessStreamError(
+  state: HeadlessStreamState,
+  route: string,
+  error: Error
+): void {
+  state.errors.set(route, error);
+}
+
+/**
+ * Checks if a route has a headless stream error.
+ * 
+ * @param state - The headless stream state
+ * @param route - The route to check
+ * @returns true if the route has a headless stream error
+ */
+export function hasHeadlessStreamError(
+  state: HeadlessStreamState,
+  route: string
+): boolean {
+  return state.errors.has(route);
+}
+
+/**
+ * Gets the headless stream error for a route.
+ * 
+ * @param state - The headless stream state
+ * @param route - The route to get the error for
+ * @returns The error if it exists, undefined otherwise
+ */
+export function getHeadlessStreamError(
+  state: HeadlessStreamState,
+  route: string
+): Error | undefined {
+  return state.errors.get(route);
+}
+
+/**
+ * Stores headless stream elements for reuse.
+ * 
+ * @param state - The headless stream state
+ * @param streamId - The stream ID
+ * @param data - The stream data to store
+ */
+export function storeHeadlessStreamElements(
+  state: HeadlessStreamState,
+  streamId: string,
+  data: HeadlessStreamData
+): void {
+  state.elements.set(streamId, data);
+}
+
+/**
+ * Gets headless stream elements for reuse.
+ * 
+ * @param state - The headless stream state
+ * @param streamId - The stream ID
+ * @returns The stream data if it exists, undefined otherwise
+ */
+export function getHeadlessStreamElements(
+  state: HeadlessStreamState,
+  streamId: string
+): HeadlessStreamData | undefined {
+  return state.elements.get(streamId);
+}
+
+/**
+ * Cleans up headless stream elements after use.
+ * 
+ * @param state - The headless stream state
+ * @param streamId - The stream ID to clean up
+ */
+export function cleanupHeadlessStreamElements(
+  state: HeadlessStreamState,
+  streamId: string
+): void {
+  state.elements.delete(streamId);
+}
+
+/**
+ * Clears all headless stream errors for a route.
+ * 
+ * @param state - The headless stream state
+ * @param route - The route to clear errors for
+ */
+export function clearHeadlessStreamErrors(
+  state: HeadlessStreamState,
+  route: string
+): void {
+  state.errors.delete(route);
+}

package/plugin/helpers/hydrateUserOptions.ts

@@ -3,7 +3,7 @@ import type { ResolvedUserOptions, SerializedUserOptions } from "../types.js";
 
 export function hydrateUserOptions(
   options: SerializedUserOptions
-): { type: "success"; userOptions: ResolvedUserOptions } | { type: "error"; error: Error } {
+): { type: "success"; userOptions: ResolvedUserOptions } | { type: "error"; error: unknown } {
   try {
     // resolveOptions already handles regex deserialization through deserializeRegExp()
     // Cast the serialized options back to the expected input format for resolveOptions
@@ -18,6 +18,6 @@ export function hydrateUserOptions(
     
     return { type: "success", userOptions };
   } catch (error) {
-    return { type: "error", error: error instanceof Error ? error : new Error(String(error)) };
+    return { type: "error", error: error };
   }
 }

package/plugin/helpers/index.ts

@@ -1,8 +1,11 @@
+import { getCondition } from "../config/getCondition.js";
+
 // Route and file handling
 export * from "./getRouteFiles.js";
 export * from "./resolvePage.js";
 export * from "./resolveProps.js";
 export * from "./resolvePageAndProps.js";
+
 export * from "./requestInfo.js";
 export * from "./requestToRoute.js";
 
@@ -12,15 +15,12 @@ export * from "./cleanObject.js";
 export * from "./inputNormalizer.js";
 
 // CSS handling
-export * from "./collectBundleManifestCss.js";
 export * from "./collectManifestCss.js";
 export * from "./collectViteModuleGraphCss.js";
 export * from "./createCssProps.js";
 
 // Stream and handler creation
-export * from "./createRscStream.js";
-export * from "./createHandler.js";
-export * from "./createEventHandler.js";
+// Stream-related functions are now exported from ../stream/index.js
 
 // Hydrate user options
 export * from "./hydrateUserOptions.js";
@@ -39,4 +39,31 @@ export * from "./moduleResolver.js";
 
 // Utility functions
 export * from "./stashReturnValue.js";
-export * from "./defaultFileWriter.js";
+export * from "./workerManager.js";
+
+// Unified render helpers
+export * from "./validateRscRenderMessage.js";
+export * from "./resolveRenderUrl.js";
+export * from "./mergeMessageWithDefaults.js";
+export * from "./resolveWithDefaultRootAndHtml.js";
+export { resolveComponents as resolveComponentsClient } from "./resolveComponents.client.js";
+
+export * from "./logRenderStart.js";
+export * from "./createSerializableHandlerOptions.js";
+
+export * from "./createPatternMatcher.js";
+
+export * from "./createUnifiedCssProcessor.js";
+
+// Server action handling
+
+const condition = getCondition("");
+const dirname = new URL("./", import.meta.url).pathname.replace(/\/$/, "");
+
+const { handleServerAction } = (await import(
+  `${dirname}/handleServerAction.${condition}.js`
+)) as {
+  handleServerAction: any
+};
+
+export {  handleServerAction };

package/plugin/helpers/logRenderStart.ts

@@ -0,0 +1,26 @@
+import type { Logger } from "vite";
+
+/**
+ * Logs render start if verbose mode is enabled
+ * 
+ * This helper provides consistent logging across different render contexts:
+ * - RSC worker renders
+ * - HTML worker renders  
+ * - Client-side renders
+ * - Server-side renders
+ * 
+ * @param route - The route being rendered
+ * @param verbose - Whether verbose logging is enabled
+ * @param logger - The logger instance to use
+ * @param context - Optional context identifier (e.g., "rsc-worker", "html-worker", "client", "server")
+ */
+export function logRenderStart(
+  route: string,
+  verbose: boolean,
+  logger: Logger,
+  context: string = "render"
+): void {
+  if (verbose) {
+    logger.info(`[${context}:${route}] Starting render for route: ${route}`);
+  }
+}

package/plugin/helpers/mergeMessageWithDefaults.ts

@@ -0,0 +1,80 @@
+import { DEFAULT_CONFIG } from "../config/index.js";
+import type { ResolvedUserOptions } from "../types.js";
+import type { RscRenderMessage } from "../worker/rsc/types.js";
+
+/**
+ * Merges message values with defaults, prioritizing message values
+ * 
+ * @param message - The RSC render message containing values to merge
+ * @param defaultUserOptions - Default user options to fall back to
+ * @returns Merged values with message values taking precedence
+ */
+export function mergeMessageWithDefaults(
+  message: RscRenderMessage,
+  defaultUserOptions: Partial<ResolvedUserOptions> = {}
+) {
+  // Extract options from the nested structure
+  const options = message.options || {};
+  
+  const {
+    type = "INIT",
+    id,
+    route = options.route,
+    pagePath = options.pagePath,
+    propsPath = options.propsPath,
+    rootPath = options.rootPath,
+    htmlPath = options.htmlPath,
+    rootExportName = options.rootExportName ?? defaultUserOptions.rootExportName ??
+      DEFAULT_CONFIG.ROOT_EXPORT_NAME,
+    htmlExportName = options.htmlExportName ?? defaultUserOptions.htmlExportName ??
+      DEFAULT_CONFIG.HTML_EXPORT_NAME,
+    pageExportName = options.pageExportName ?? defaultUserOptions.pageExportName ??
+      DEFAULT_CONFIG.PAGE_EXPORT_NAME,
+    propsExportName = options.propsExportName ?? defaultUserOptions.propsExportName ??
+      DEFAULT_CONFIG.PROPS_EXPORT_NAME,
+    projectRoot = options.projectRoot ?? defaultUserOptions.projectRoot,
+    moduleRootPath = options.moduleRootPath ?? defaultUserOptions.moduleRootPath ?? "",
+    moduleBaseURL = options.moduleBaseURL ?? defaultUserOptions.moduleBaseURL ??
+      DEFAULT_CONFIG.MODULE_BASE_URL,
+    moduleBasePath = options.moduleBasePath ?? defaultUserOptions.moduleBasePath ??
+      DEFAULT_CONFIG.MODULE_BASE_PATH,
+    moduleBase = options.moduleBase ?? defaultUserOptions.moduleBase ?? "",
+    serverPipeableStreamOptions = options.serverPipeableStreamOptions ?? defaultUserOptions.serverPipeableStreamOptions,
+    verbose = options.verbose ?? defaultUserOptions.verbose ?? DEFAULT_CONFIG.VERBOSE,
+    build = options.build ?? defaultUserOptions.build ?? DEFAULT_CONFIG.BUILD,
+    rscTimeout = options.rscTimeout ?? defaultUserOptions.rscTimeout ?? DEFAULT_CONFIG.RSC_TIMEOUT,
+    panicThreshold = options.panicThreshold ?? defaultUserOptions.panicThreshold ??
+      DEFAULT_CONFIG.PANIC_THRESHOLD,
+    publicOrigin = options.publicOrigin ?? defaultUserOptions.publicOrigin ??
+      DEFAULT_CONFIG.PUBLIC_ORIGIN,
+    HtmlComponent: _htmlComponent = options.HtmlComponent, // Ignore message component, use parameter
+    RootComponent: _rootComponent = options.RootComponent, // Ignore message component, use parameter
+    ...rest
+  } = { ...message, ...options };
+
+  return {
+    type,
+    id,
+    route,
+    pagePath,
+    propsPath,
+    rootPath,
+    htmlPath,
+    rootExportName,
+    htmlExportName,
+    pageExportName,
+    propsExportName,
+    projectRoot,
+    moduleRootPath,
+    moduleBaseURL,
+    moduleBasePath,
+    moduleBase,
+    serverPipeableStreamOptions,
+    verbose,
+    build,
+    rscTimeout,
+    panicThreshold,
+    publicOrigin,
+    ...rest,
+  };
+}

package/plugin/helpers/pipeToResponse.ts

@@ -0,0 +1,77 @@
+import { Readable } from "node:stream";
+import type { ServerResponse } from "node:http";
+import type { ReadableStream } from "node:stream/web";
+import { handleError } from "../error/handleError.js";
+import { getNodeEnv } from "../config/getNodeEnv.js";
+import type { Logger } from "vite";
+import type { PanicThreshold } from "../types.js";
+
+export interface PipeToResponseOptions {
+  stream: ReadableStream<Uint8Array> | any; // Allow any for now to handle type mismatches
+  response: ServerResponse;
+  contentType: string;
+  logger: Logger;
+  verbose?: boolean;
+  panicThreshold?: PanicThreshold;
+  context?: string;
+}
+
+/**
+ * Pipes a ReadableStream to an HTTP response with proper error handling and headers.
+ * This is a common pattern used across the plugin for streaming responses.
+ */
+export function pipeToResponse(options: PipeToResponseOptions): void {
+  const { stream, response, contentType, logger, verbose = false, panicThreshold = "none", context = "pipeToResponse" } = options;
+
+  if (!response.writable) {
+    if (verbose) {
+      logger.warn(`[${context}] Response not writable, skipping pipe`);
+    }
+    return;
+  }
+
+  const readable = Readable.fromWeb(stream as ReadableStream);
+  let headersSent = false;
+
+  readable.on('data', (chunk) => {
+    if (!headersSent) {
+      // Only send headers when first chunk arrives
+      response.setHeader("Content-Type", contentType);
+      response.setHeader("Transfer-Encoding", "chunked");
+      response.setHeader("Connection", "keep-alive");
+      headersSent = true;
+    }
+    response.write(chunk);
+  });
+
+  readable.on('end', () => {
+    response.end();
+  });
+
+  readable.on('error', (error) => {
+    const panicError = handleError({
+      error,
+      logger,
+      mode: getNodeEnv(),
+      panicThreshold,
+      context,
+    });
+    
+    if (panicError != null) {
+      throw panicError;
+    }
+    
+    if (verbose) {
+      logger.info(`[${context}] Stream error caught, headersSent: ${headersSent}, setting status to 500`);
+    }
+    
+    if (!headersSent) {
+      response.statusCode = 500;
+      response.setHeader("Content-Type", "text/x-component; charset=utf-8");
+      response.end();
+    } else {
+      // If error after headers, just end the response
+      response.end();
+    }
+  });
+}