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

package/plugin/helpers/resolveStreamElements.client.ts

@@ -0,0 +1,50 @@
+import type { ResolveStreamElementsOptions } from "./resolveStreamElements.types.js";
+import { PassThrough } from "node:stream";
+import {
+  getStashedRscStream,
+  stashRscStream,
+} from "../config/stashedOptionsState.js";
+import { assertNonReactServer } from "../config/getCondition.js";
+import { createFromNodeStream } from "../stream/createFromNodeStream.client.js";
+import { DEFAULT_CONFIG } from "../config/defaults.js";
+
+assertNonReactServer();
+
+/**
+ * Client version of resolveStreamElements.
+ *
+ * Strategy: Get RSC stream from worker and convert to React elements.
+ * This involves:
+ * 1. Getting or creating a PassThrough stream for the route
+ * 2. Converting the RSC stream to React elements using ReactDOMClient.createFromNodeStream
+ * 3. Returning the React elements for client-side hydration
+ */
+export async function resolveStreamElements(
+  options: ResolveStreamElementsOptions
+) {
+  const { id, route, moduleBaseURL, moduleRootPath, moduleBasePath, logger } =
+    options;
+  // Get or create a PassThrough stream for this route
+  let rscStream = getStashedRscStream(id);
+
+  if (!rscStream) {
+    // Create a new PassThrough stream for this route
+    rscStream = new PassThrough();
+    stashRscStream(id, rscStream);
+
+    if (logger?.info) {
+      logger.info(
+        `[resolveStreamElements.client] Created new RSC stream for route: ${route}`
+      );
+    }
+  }
+
+  // Convert RSC stream to React elements using ReactDOMClient.createFromNodeStream
+  return createFromNodeStream({
+    rscStream,
+    moduleRootPath: moduleRootPath,
+    moduleBasePath: moduleBasePath ?? DEFAULT_CONFIG.MODULE_BASE_PATH,
+    moduleBaseURL: moduleBaseURL,
+    logger,
+  });
+}

package/plugin/helpers/resolveStreamElements.server.ts

@@ -0,0 +1,43 @@
+import type { ResolveStreamElementsOptions } from "./resolveStreamElements.types.js";
+import { React } from "../vendor/vendor.server.js";
+import { createElementWithReact } from "./createElementWithReact.js";
+import { createHandlerOptions } from "../config/createHandlerOptions.server.js";
+import {
+  clearStashedUserOptions,
+  getEnvironmentId,
+} from "../config/stashedOptionsState.js";
+import { getCondition } from "../config/getCondition.js";
+
+/**
+ * Server version of resolveStreamElements.
+ *
+ * Strategy: Resolve components and create React elements.
+ * This involves:
+ * 1. Getting handler options (which already resolves components)
+ * 2. Creating React elements that can be passed to ReactDOMServer.renderToPipeableStream
+ * 3. Returning the React elements for server-side rendering
+ */
+export async function resolveStreamElements(
+  options: ResolveStreamElementsOptions
+) {
+  const shouldClearStashed = false;
+  const envId = getEnvironmentId(getCondition(), process.env.NODE_ENV ?? "production");
+
+
+  try {
+    // Get proper handler options using the existing infrastructure
+    // This already resolves components internally
+    const handlerOptions = await createHandlerOptions(options.route, {
+      logger: options.logger,
+    });
+    return {
+      type: "server" as const,
+      elements: createElementWithReact(React, handlerOptions),
+    };
+  } finally {
+    // Clean up temporarily stashed options if we stashed them
+    if (shouldClearStashed) {
+      clearStashedUserOptions(envId);
+    }
+  }
+}

package/plugin/helpers/resolveStreamElements.ts

@@ -0,0 +1,13 @@
+import { getCondition } from "../config/getCondition.js";
+import type { ResolveStreamElementsFn } from "./resolveStreamElements.types.js";
+
+// Use Node.js conditions to determine which implementation to use
+const condition = getCondition("");
+const dirname = new URL("./", import.meta.url).pathname.replace(/\/$/, "");
+
+// Dynamically import the appropriate resolveStreamElements implementation
+export const { resolveStreamElements } = (await import(
+  `${dirname}/resolveStreamElements.${condition}.js`
+)) as {
+  resolveStreamElements: ResolveStreamElementsFn;
+}; 

package/plugin/helpers/resolveStreamElements.types.ts

@@ -0,0 +1,29 @@
+export interface ResolveStreamElementsOptions {
+  route: string;
+  moduleRootPath: string; // Made optional since it can come from userOptions
+  moduleBasePath?: string;
+  pagePath?: string;
+  propsPath?: string;
+  rootPath?: string;
+  htmlPath?: string;
+  moduleBaseURL: string;
+  verbose?: boolean;
+  logger?: any;
+  id: string;
+}
+
+export type ResolveStreamElementsResult = 
+  | {
+      type: "client";
+      elements: any; // React element from hydrated RSC stream
+    }
+  | {
+      type: "server";
+      elements: any; // React element that can be passed to renderToPipeableStream
+    };
+
+export type ResolveStreamElementsFn = <
+  Opt extends ResolveStreamElementsOptions = ResolveStreamElementsOptions
+>(
+  options: Opt
+) => Promise<ResolveStreamElementsResult>; 

package/plugin/helpers/resolveVirtualAndNodeModules.ts

@@ -0,0 +1,75 @@
+import type { Logger } from "vite";
+
+/**
+ * Shared utility for handling virtual modules and node_modules in loaders.
+ * 
+ * For virtual modules and node_modules, we use Node.js native resolution.
+ * These should be handled by Node.js's module resolution, not custom logic.
+ * 
+ * @param moduleId - The module ID to resolve
+ * @param exportName - Optional export name to extract
+ * @param verbose - Whether to log verbose messages
+ * @param logger - Logger instance
+ * @returns The resolved module, or null if this isn't a virtual/node_modules module
+ */
+export async function resolveVirtualAndNodeModules(
+  moduleId: string,
+  exportName?: string,
+  verbose = false,
+  logger?: Logger
+): Promise<Record<string, any> | null> {
+  // For virtual modules and node_modules, use Node.js native resolution
+  if (
+    !moduleId.includes("_virtual/") &&
+    !moduleId.startsWith("_virtual") &&
+    !moduleId.includes("node_modules")
+  ) {
+    return null; // Not a virtual module or node_modules, let caller handle it
+  }
+
+  try {
+    // Try to import directly - Node.js will resolve it
+    const module = await import(moduleId);
+    if (exportName && !(exportName in module)) {
+      throw new Error(
+        `Export ${exportName} not found in module ${moduleId}`
+      );
+    }
+    return module;
+  } catch (error) {
+    // If it's the dynamic-import-helper, provide a shim
+    if (moduleId.includes("dynamic-import-helper")) {
+      if (verbose) {
+        logger?.warn(
+          `[resolveVirtualAndNodeModules] Virtual module detected: ${moduleId}. Providing shim for variable dynamic imports.`
+        );
+      }
+
+      // _virtual/dynamic-import-helper.js is generated for variable dynamic imports
+      // Provide a shim that uses native dynamic import
+      const dynamicImportHelper = (specifier: string) => {
+        return import(specifier);
+      };
+
+      const shim = {
+        default: dynamicImportHelper,
+        __variableDynamicImportRuntimeHelper: dynamicImportHelper,
+      };
+
+      if (exportName) {
+        if (
+          exportName === "default" ||
+          exportName === "__variableDynamicImportRuntimeHelper"
+        ) {
+          return { [exportName]: dynamicImportHelper };
+        }
+        return shim;
+      }
+      return shim;
+    }
+
+    // For other virtual modules or node_modules, re-throw the error
+    throw error;
+  }
+}
+

package/plugin/helpers/resolveWithDefaultRootAndHtml.ts

@@ -0,0 +1,25 @@
+import type { HtmlComponentType, RootComponentType } from "../types.js";
+import type { React } from "../vendor/vendor.server.js";
+import { Html as DefaultHtml } from "../components/html.js";
+import { Root as DefaultRoot } from "../components/root.js";
+
+/**
+ * Resolves components with appropriate fallbacks
+ * 
+ * This helper can be used in both client and server environments to ensure
+ * that RootComponent and HtmlComponent are always defined, falling back to
+ * default components when needed.
+ * 
+ * @param RootComponent - The root component to use, or undefined to use default
+ * @param HtmlComponent - The HTML component to use, or undefined to use default
+ * @returns Object containing resolved RootComponent and HtmlComponent
+ */
+export function resolveWithDefaultRootAndHtml(
+  RootComponent?: RootComponentType | typeof React.Fragment | undefined,
+  HtmlComponent?: HtmlComponentType | typeof React.Fragment | undefined
+) {
+  return {
+    RootComponent: RootComponent || DefaultRoot,
+    HtmlComponent: HtmlComponent || DefaultHtml,
+  };
+}

package/plugin/helpers/serializeUserOptions.ts

@@ -8,6 +8,7 @@ import type {
   Serializable,
 } from "../types.js";
 import { cleanObject } from "./cleanObject.js";
+import { DEFAULT_CONFIG } from "../config/defaults.js";
 
 // Common non-serializable functions in Vite's resolved config
 const VITE_NON_SERIALIZABLE_FUNCTIONS = new Set([
@@ -90,10 +91,6 @@ const PLUGIN_NON_SERIALIZABLE_FUNCTIONS = new Set([
   "Html",
   "onEvent",
   "onMetrics",
-  "build.entryFile",
-  "build.chunkFile",
-  "build.assetFile",
-  "build.pages",
   "autoDiscover",
 ]);
 
@@ -125,6 +122,10 @@ export function deserializeRegExp<T>(obj: T): Extract<T, SerializableRecord> {
     >;
   }
   if (Array.isArray(obj)) {
+    // Check if this is a serialized Map (array of [key, value] pairs)
+    if (obj.length > 0 && Array.isArray(obj[0]) && obj[0].length === 2) {
+      return new Map(obj) as unknown as Extract<T, SerializableRecord>;
+    }
     return obj.map(deserializeRegExp) as unknown as Extract<
       T,
       SerializableRecord
@@ -150,6 +151,10 @@ export function processForSerialization<T>(
   if (obj instanceof RegExp) {
     return serializeRegExp(obj) as unknown as Extract<T, Serializable>;
   }
+  if (obj instanceof Map) {
+    // Convert Map to array of [key, value] pairs for serialization
+    return Array.from(obj.entries()) as unknown as Extract<T, Serializable>;
+  }
   if (Array.isArray(obj)) {
     return obj.map(processForSerialization) as unknown as Extract<
       T,
@@ -173,6 +178,10 @@ export function serializeResolvedConfig<T extends ResolvedConfig = ResolvedConfi
   config: T,
   knownNonSerializableFunctions: Set<string> = VITE_NON_SERIALIZABLE_FUNCTIONS
 ) {
+  if (!config) {
+    return undefined;
+  }
+
   const {
     getSortedPluginHooks: _getSortedPluginHooks,
     getSortedPlugins: _getSortedPlugins,
@@ -239,14 +248,17 @@ export const serializedDevServerConfig = <T extends ViteDevServer["config"]>(
     build: _build,
     ...handlerOptions
   } = config;
+  
   return processForSerialization(
     cleanObject(handlerOptions, customNonSerializableFunctions)
   );
 };
 
+
+
 // For your own options (if you need custom non-serializable functions)
-export const serializedOptions = (
-  userOptions: ResolvedUserOptions,
+export const serializedOptions = <T extends ResolvedUserOptions>(
+  userOptions: T,
   autoDiscoveredFiles: AutoDiscoveredFiles,
   customNonSerializableFunctions: Set<string> = PLUGIN_NON_SERIALIZABLE_FUNCTIONS
 ): SerializedUserOptions => {
@@ -263,6 +275,8 @@ export const serializedOptions = (
     autoDiscover: autoDiscover,
     propsExportName: propsExportName,
     pageExportName: pageExportName,
+    serverPipeableStreamOptions: serverPipeableStreamOptions,
+    clientPipeableStreamOptions: clientPipeableStreamOptions,
     ...handlerOptions
   } = userOptions;
   const {
@@ -272,9 +286,21 @@ export const serializedOptions = (
     pages: _pages,
     ...buildOptions
   } = _build ?? {};
+  // Preserve the build properties that should be serialized
+  // Respect user options first, then fall back to defaults
+  const serializedBuild = {
+    ...DEFAULT_CONFIG.BUILD,  // Start with defaults
+    ...buildOptions,          // Override with user options
+    pages: autoDiscoveredFiles
+      ? Array.from(autoDiscoveredFiles.urlMap.keys())
+      : [],
+  };
+  
   const {
     isServerFunctionCode: _isServerFunctionCode,
     isClientComponentCode: _isClientComponentCode,
+    isClientComponentByCode: _isClientComponentByCode,
+    isClientComponentByName: _isClientComponentByName,
     getDirectiveType: _getDirectiveType,
     allowedDirectives: allowedDirectives,
     ...loaderOptions
@@ -306,12 +332,7 @@ export const serializedOptions = (
     onMetrics: undefined,
     propsExportName: propsExportName,
     pageExportName: pageExportName,
-    build: {
-      ...buildOptions,
-      pages: autoDiscoveredFiles
-        ? Array.from(autoDiscoveredFiles.urlMap.keys())
-        : [],
-    },
+    build: serializedBuild,
     loader: {
       directivePattern: {
         config: {
@@ -338,11 +359,12 @@ export const serializedOptions = (
       rscPattern: serializeRegExp(_rscPattern),
       ...serializedAutoDiscover,
     },
+    serverPipeableStreamOptions: serverPipeableStreamOptions,
+    clientPipeableStreamOptions: clientPipeableStreamOptions,
   } as const
 
   // Clean the object to remove non-serializable properties and process RegExp objects
-  const finalResult = processForSerialization(
-    cleanObject(result, customNonSerializableFunctions)
-  );
+  const cleanedResult = cleanObject(result, customNonSerializableFunctions);
+  const finalResult = processForSerialization(cleanedResult);
   return finalResult as never
 };

package/plugin/helpers/tryManifest.ts

@@ -5,13 +5,14 @@ import { readFile } from "node:fs/promises";
 
 export type TryManifestOptions<SSR extends boolean = false> = {
   root: string;
+  // depends on the build.outDir and build.static/build.client, etc
   outDir: string;
+  // changes types and defaults to be SSR/non ssr manifest
   ssrManifest?: SSR;
-  preserveModulesRoot?: string;
   manifestPath?: string | boolean | undefined;
 };
 
-export async function tryManifest<SSR extends boolean>(
+export async function tryManifest<SSR extends boolean = false>(
   options: TryManifestOptions<SSR>
 ): Promise<
   | {
@@ -26,18 +27,22 @@ export async function tryManifest<SSR extends boolean>(
     }
   | {
       type: "skip";
+      manifest: Manifest;
     }
 > {
   let path = options.manifestPath;
   if (path === false) {
     return {
       type: "skip",
+      manifest: {},
     };
   }
-  if (options.ssrManifest) {
-    path = join(".vite", "ssr-manifest.json");
-  } else {
-    path = join(".vite", "manifest.json");
+  if (!path || path === true) {
+    if (options.ssrManifest) {
+      path = join(".vite", "ssr-manifest.json");
+    } else {
+      path = join(".vite", "manifest.json");
+    }
   }
   try {
     const result = JSON.parse(
@@ -48,6 +53,10 @@ export async function tryManifest<SSR extends boolean>(
       manifest: result,
     };
   } catch (e) {
+    // If manifest is not found, treat as skip so callers can proceed gracefully
+    if ((e as any)?.code === "ENOENT") {
+      return { type: "skip", manifest: {} };
+    }
     return {
       type: "error",
       error: e as Error,

package/plugin/helpers/validateRscRenderMessage.ts

@@ -0,0 +1,13 @@
+import type { RscRenderMessage } from "../worker/rsc/types.js";
+
+/**
+ * Validates that the message is of the correct type for RSC rendering
+ * 
+ * @param message - The RSC render message to validate
+ * @throws {Error} If the message type is not "INIT"
+ */
+export function validateRscRenderMessage(message: RscRenderMessage): void {
+  if (message.type !== "INIT") {
+    throw new Error("Invalid message type");
+  }
+}

package/plugin/helpers/workerCleanup.ts

@@ -0,0 +1,85 @@
+import type { Worker, MessagePort } from "node:worker_threads";
+
+/**
+ * Centralized worker cleanup utilities
+ * Provides consistent cleanup patterns across the codebase
+ */
+
+export interface WorkerCleanupOptions {
+  /** Whether to terminate the worker (default: true) */
+  terminate?: boolean;
+  /** Whether to remove all listeners (default: true) */
+  removeListeners?: boolean;
+  /** Whether to log cleanup errors (default: false) */
+  logErrors?: boolean;
+}
+
+/**
+ * Safely cleans up a worker with consistent error handling
+ */
+export function cleanupWorker(
+  worker: Worker | null | undefined,
+  options: WorkerCleanupOptions = {}
+): void {
+  if (!worker) return;
+
+  const {
+    terminate = true,
+    removeListeners = true,
+    logErrors = false
+  } = options;
+
+  try {
+    if (removeListeners) {
+      worker.removeAllListeners();
+    }
+    
+    if (terminate) {
+      worker.terminate();
+    }
+  } catch (error) {
+    if (logErrors) {
+      console.warn('[workerCleanup] Error during worker cleanup:', error);
+    }
+    // Always ignore cleanup errors to prevent cascading failures
+  }
+}
+
+/**
+ * Safely cleans up MessagePorts with consistent error handling
+ */
+export function cleanupMessagePorts(
+  ports: (MessagePort | null | undefined)[],
+  options: { logErrors?: boolean } = {}
+): void {
+  const { logErrors = false } = options;
+
+  for (const port of ports) {
+    if (!port) continue;
+
+    try {
+      // Remove onmessage handlers (property assignment cleanup)
+      (port as any).onmessage = null;
+      // Close the port
+      port.close();
+    } catch (error) {
+      if (logErrors) {
+        console.warn('[workerCleanup] Error during MessagePort cleanup:', error);
+      }
+      // Always ignore cleanup errors
+    }
+  }
+}
+
+/**
+ * Comprehensive cleanup for worker + MessagePorts combination
+ * This is the most common cleanup pattern in the codebase
+ */
+export function cleanupWorkerAndPorts(
+  worker: Worker | null | undefined,
+  ports: (MessagePort | null | undefined)[],
+  options: WorkerCleanupOptions = {}
+): void {
+  cleanupMessagePorts(ports, { logErrors: options.logErrors });
+  cleanupWorker(worker, options);
+}

package/plugin/helpers/workerManager.ts

@@ -0,0 +1,16 @@
+import type { Worker } from "node:worker_threads";
+
+// Simple module-level worker reference for dev server context
+let worker: Worker | null = null;
+
+export const setWorker = (w: Worker | null) => {
+  worker = w;
+};
+
+export const getWorker = (): Worker | null => {
+  return worker;
+};
+
+export const clearWorker = () => {
+  worker = null;
+}; 

package/plugin/index.ts

@@ -1,5 +1,9 @@
 import { getCondition } from './config/getCondition.js';
+import { pluginRoot } from './root.js';
+import type { VitePluginMainFn } from './types.js';
 
-const condition = getCondition('');
+export const condition = getCondition('');
+export const { vitePluginReactServer, vitePluginReactClient } = (await import(`${pluginRoot}/plugin.${condition}.js`)) as { vitePluginReactServer: VitePluginMainFn, vitePluginReactClient: VitePluginMainFn };
 
-export const { vitePluginReactServer } = await import(`./plugin.${condition}.js`);
+// Export the orchestrator for direct use
+export { createPluginOrchestrator } from './orchestrator/createPluginOrchestrator.js';

package/plugin/loader/createDefaultLoader.ts

@@ -47,7 +47,6 @@ const defaultNextLoad: Parameters<LoadHook>[2] = async (url) => {
 export function createDefaultLoader(
   defaultSource: string,
   defaultId = "index",
-  verbose = false
 ): (
   url: string,
   context?: Partial<LoadHookContext>,
@@ -82,28 +81,11 @@ export function createDefaultLoader(
     },
     nextLoad = defaultSourceNextLoad
   ) => {
-    if (verbose) {
-      console.log("[createDefaultLoader] Loading:", url);
-      console.log("[createDefaultLoader] Context:", {
-        format: context.format,
-        conditions: context.conditions,
-      });
-    }
 
     const { format } = context;
     if (format === "module" || format === "module-typescript") {
-      if (verbose) {
-        console.log("[createDefaultLoader] Loading module:", url);
-      }
 
       const result = await nextLoad(url, context);
-      if (verbose) {
-        console.log("[createDefaultLoader] Next load result:", {
-          format: result.format,
-          shortCircuit: result.shortCircuit,
-          source: typeof result.source,
-        });
-      }
 
       const source =
         typeof result.source === "string"
@@ -130,9 +112,6 @@ export function createDefaultLoader(
       };
     }
 
-    if (verbose) {
-      console.log("[createDefaultLoader] Skipping non-module format:", format);
-    }
     return nextLoad(url, context);
   };
 }