@lwrjs/lwc-ssr 0.12.0-alpha.8 → 0.12.0

package/README.md

@@ -4,12 +4,12 @@
     -   [What is SSR?](#what-is-ssr)
     -   [Why use SSR?](#why-use-ssr)
 -   [Using SSR with LWR](#using-ssr-with-lwr)
-    -   [Add the SSR package dependency](#add-the-ssr-package-dependency)
     -   [Turn on SSR](#turn-on-ssr)
     -   [Building SSR pages](#building-ssr-pages)
     -   [SSR detection](#ssr-detection)
     -   [Loading data during SSR](#loading-data-during-ssr)
     -   [Caching](#caching)
+    -   [Timeouts](#timeouts)
 -   [Islands](#islands)
     -   [Client hydration](#client-hydration)
     -   [Skip SSR](#skip-ssr)
@@ -21,7 +21,7 @@
     -   [Slots](#slots)
 -   [Debugging](#debugging)
     -   [Debug logging](#debug-logging)
-    -   [Inspect bundles](#inspect-bundles)
+    -   [Local dev](#local-dev)
 -   [Diagrams](#diagrams)
     -   [Sequence](#sequence)
 
@@ -46,19 +46,6 @@ That said, SSR is best used for apps where time-to-content is important, such as
 
 Learn how to use SSR in LWR apps.
 
-### Add the SSR package dependency
-
-Add SSR capabilities to an LWR app by including `@lwrjs/lwc-ssr` in its _package.json_.
-
-```json
-// my-app/package.json
-{
-    "dependencies": {
-        "@lwrjs/lwc-ssr": "latest"
-    }
-}
-```
-
 ### Turn on SSR
 
 SSR is activated on a per-route basis by changing `bootstrap.ssr` to `true`.
@@ -232,7 +219,7 @@ Notes:
 
 -   The `getServerData()` hook can choose to merge the properties from `SsrRequestContext.props` into its return object, or it can ignore/discard them.
 -   The author of `getServerData()` is responsible for validating the `params` and `query` from `SsrRequestContext` before using them.
--   The **same** `props` returned by `getServerData()` are passed to the component during server rendering **and** client hydration.
+-   The **same** `props` returned by `getServerData()` are passed to the component during server rendering **and** [client hydration](#client-hydration).
 
 ### Caching
 
@@ -245,6 +232,15 @@ There are two other ways to set a TTL on a page document:
 
 LWR will use the shortest TTL value from **all** sources to set the `max-age` of the `Cache-control` header on the page.
 
+### Timeouts
+
+By default, LWR will timeout and return a 500 error if SSR takes longer than 5 seconds. This includes [loading data](#loading-data-during-ssr). The timeout length (in milliseconds) can be overridden by setting the `SSR_TIMEOUT` environment variable before running the app.
+
+```bash
+# set the timeout to 10 seconds
+SSR_TIMEOUT=10000 yarn start
+```
+
 ## Islands
 
 [Islands of interactivity](https://jasonformat.com/islands-architecture/) can be created using the `lwr:hydrate` directive. LWR supports [hydrated](#client-hydration) and [CSR](#skip-ssr) islands.
@@ -283,15 +279,6 @@ Root components can skip SSR by setting the `lwr:hydrate` directive to `client-o
 
 Root components which opt-out of SSR will be fully rendered on the client using the [LWC `createElement()` API](https://www.npmjs.com/package/@lwc/engine-dom).
 
-### Timeouts
-
-By default, LWR will timeout and return a 500 error if SSR takes longer than 5 seconds. This includes [loading data](#loading-data-during-ssr). The timeout length (in milliseconds) can be overridden by setting the `SSR_TIMEOUT` environment variable before running the app.
-
-```bash
-# set the timeout to 10 seconds
-SSR_TIMEOUT=10000 yarn start
-```
-
 ## Routing
 
 LWR provides a Server Router, which is similar to the [Client Router](../router/README.md). The Server Router is fully compatible with SSRed pages, including [islands](#islands). It:
@@ -406,36 +393,6 @@ The LWC SSR process runs in a single synchronous pass. So any asynchronous code
 
 Components rendered in synthetic shadow or light DOM can rely on globally defined CSS, but [native shadow DOM blocks global styles](https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_shadow_DOM#styling_the_shadow_dom) from being applied. Therefore SSRed components must use light DOM, or all of its CSS must be self-contained for native shadow compatibility.
 
-If a page renders both SSRed and CSRed root components in shadow DOM, then [mixed shadow mode](https://developer.salesforce.com/docs/platform/lwc/guide/create-mixed-shadow.html) must be enabled for the route:
-
-```html
-<!-- my-app/src/content/home.html -->
-
-<!-- SSRed and hydrated (native shadow) -->
-<my-info lwr:hydrate="load"></my-info>
-
-<!-- CSRed (synthetic shadow) -->
-<my-map lwr:hydrate="client-only"></my-map>
-```
-
-```json
-// my-app/lwr.config.json
-{
-    "routes": [
-        {
-            "id": "home",
-            "path": "/",
-            "contentTemplate": "$contentDir/home.html",
-            "bootstrap": {
-                "ssr": true,
-                "mixedMode": true,
-                "syntheticShadow": true
-            }
-        }
-    ]
-}
-```
-
 ### Slots
 
 Root components may **not** contain [slots](https://developer.salesforce.com/docs/component-library/documentation/en/lwc/lwc.create_components_slots), regardless of whether the component is SSRed or CSRed.
@@ -450,16 +407,9 @@ See fine-grained logging with the `LOG_LEVEL` flag:
 LOG_LEVEL=debug MODE=prod-compat yarn start # start up the LWR server, in any mode
 ```
 
-### Inspect bundles
-
-When SSR fails due to a [portability](#portability), it can be difficult to figure out which component is causing the issue. The broken component can be found by inspecting the module bundle for the page:
-
-1. Go to the LWR config for the app (ie: _lwr.config.json_), and turn the [`ssr` flag](#turn-on-ssr) on the broken route **off**.
-2. Start the LWR app and load the route in the browser.
-3. Inspect the page's module bundles for the problematic code. Module bundles are served from _/1/bundle/..._.
-4. When the problematic code is found, scroll up to find the component to which it belongs.
+### Local dev
 
-For example, if SSR fails with this error: `ReferenceError: window is not defined`, then turn off SSR and search the module bundles for prohibited usages of the `window` object.
+Coming soon...
 
 ## Diagrams
 

package/build/cjs/dataViewTransformer/index.cjs

@@ -30,7 +30,7 @@ __export(exports, {
 var import_diagnostics = __toModule(require("@lwrjs/diagnostics"));
 var import_instrumentation = __toModule(require("@lwrjs/instrumentation"));
 var import_identity = __toModule(require("../identity.cjs"));
-var import_ssr_element = __toModule(require("../utils/ssr-element.cjs"));
+var import_ssr_bootstrap = __toModule(require("../utils/ssr-bootstrap.cjs"));
 var import_utils = __toModule(require("../utils/utils.cjs"));
 var NAME = "preload-data-transformer";
 function preloadDataViewTransformer(_options, {config, moduleBundler, resourceRegistry}) {
@@ -43,12 +43,22 @@ function preloadDataViewTransformer(_options, {config, moduleBundler, resourceRe
         return {};
       }
       import_diagnostics.logger.debug({label: NAME, message: `Preload data for root component "${rootComponent}"`});
-      const {props = {}, cache: {ttl} = {ttl: void 0}} = await (0, import_instrumentation.getTracer)().trace({
+      const {results = {}, errors} = await (0, import_instrumentation.getTracer)().trace({
         name: import_instrumentation.ViewSpan.PreloadData,
         attributes: {rootComponent}
       }, async () => {
-        return await (0, import_ssr_element.runServerBootstrap)({specifier: `${import_identity.LWC_SSR_PREFIX}${viewContext.view.id}/${rootComponent}`, props: {}}, moduleBundler, resourceRegistry, routes, viewContext);
+        return await (0, import_ssr_bootstrap.runServerBootstrap)({specifier: `${import_identity.LWC_SSR_PREFIX}${viewContext.view.id}/${rootComponent}`, props: {}}, moduleBundler, resourceRegistry, routes, viewContext);
       });
+      if (errors) {
+        for (const err of Object.entries(errors)) {
+          import_diagnostics.logger.warn({
+            label: "preloadDataViewTransformer",
+            message: `Unexpected error during preload data: ${err[0]}`
+          }, err[1]);
+        }
+        return {};
+      }
+      const {props, cache: {ttl} = {ttl: void 0}} = results[rootComponent];
       import_diagnostics.logger.verbose({label: NAME, message: "response", additionalInfo: props});
       metadata.serverData = metadata.serverData || {};
       Object.assign(metadata.serverData, props);

package/build/cjs/identity.cjs

@@ -1,25 +1,9 @@
-var __create = Object.create;
 var __defProp = Object.defineProperty;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __markAsModule = (target) => __defProp(target, "__esModule", {value: true});
 var __export = (target, all) => {
   for (var name in all)
     __defProp(target, name, {get: all[name], enumerable: true});
 };
-var __exportStar = (target, module2, desc) => {
-  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
-    for (let key of __getOwnPropNames(module2))
-      if (!__hasOwnProp.call(target, key) && key !== "default")
-        __defProp(target, key, {get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable});
-  }
-  return target;
-};
-var __toModule = (module2) => {
-  return __exportStar(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", module2 && module2.__esModule && "default" in module2 ? {get: () => module2.default, enumerable: true} : {value: module2, enumerable: true})), module2);
-};
 
 // packages/@lwrjs/lwc-ssr/src/identity.ts
 __markAsModule(exports);
@@ -28,23 +12,25 @@ __export(exports, {
   SSR_PROPS_ATTR: () => SSR_PROPS_ATTR,
   getPropsId: () => getPropsId,
   getSsrServices: () => getSsrServices,
-  parseSpecifier: () => parseSpecifier
+  parseBootstrapSpecifier: () => parseBootstrapSpecifier
 });
-var import_shared_utils = __toModule(require("@lwrjs/shared-utils"));
 var LWC_SSR_PREFIX = "@lwrjs/lwc-ssr/";
 var SSR_PROPS_ATTR = "data-lwr-props-id";
 function getPropsId() {
   return `lwcprops${Math.floor(Math.random() * 65536).toString(16)}`;
 }
-function parseSpecifier(specifier, routes = []) {
+function parseBootstrapSpecifier(specifier, routes = []) {
   if (specifier.startsWith(LWC_SSR_PREFIX)) {
     const parts = specifier.replace(LWC_SSR_PREFIX, "");
     const slash = parts.indexOf("/");
     if (slash) {
       const routeId = parts.substring(0, slash);
-      const rootSpecifier = parts.substring(slash + 1);
-      if ((0, import_shared_utils.isSpecifier)(rootSpecifier)) {
-        return {rootSpecifier, route: routes.find((r) => r.id === routeId)};
+      const rootSpecifierStr = parts.substring(slash + 1);
+      if (rootSpecifierStr) {
+        return {
+          rootSpecifiers: rootSpecifierStr.split(","),
+          route: routes.find((r) => r.id === routeId)
+        };
       }
     }
   }

package/build/cjs/moduleProvider/index.cjs

@@ -29,102 +29,111 @@ __export(exports, {
 var import_shared_utils = __toModule(require("@lwrjs/shared-utils"));
 var import_instrumentation = __toModule(require("@lwrjs/instrumentation"));
 var import_identity = __toModule(require("../identity.cjs"));
-function createServerBootstrapModule(rootSpecifier, isSSR, services) {
-  let serviceImports = "";
-  let serviceCalls = "";
-  services.forEach((service) => {
-    const importName = (0, import_shared_utils.stringToVariableName)(`service_${service}`);
-    serviceImports += `
-import ${importName} from '${service}';`;
-    serviceCalls += `
+function createDataCall(rootSpecifier, classImportName) {
+  return `
 
-        globalThis.trace({
-            name: '${import_instrumentation.ViewSpan.BootstrapService}',
-            attributes: {
-                specifier: '${rootSpecifier}',
-                serviceSpecifier: '${service}',
+    results['${rootSpecifier}'] = { props: context.props['${rootSpecifier}'] }; // props from HTML attributes
+    if (${classImportName}.getServerData) {
+        await globalThis.trace({
+            name: '${import_instrumentation.ViewSpan.GetServerData}',
+            attributes: { specifier: '${rootSpecifier}' }
+        }, async() => {
+            try {
+                const data${classImportName} = await ${classImportName}.getServerData({ ...context, props: results['${rootSpecifier}'].props });
+                Object.assign(serverData, data${classImportName}.props); // add props to server data
+                Object.assign(results['${rootSpecifier}'], { props: data${classImportName}.props, markup: data${classImportName}.markup, cache: data${classImportName}.cache });
+            } catch(e) {
+                // add the root component specifier to the error message
+                errors['${rootSpecifier}'] = 'Error in "getServerData" for "${rootSpecifier}": ' + stringifyError(e);
             }
+        });
+    }`;
+}
+function createServiceCall(serviceSpecifier, importName) {
+  return `
+
+    globalThis.trace({
+        name: '${import_instrumentation.ViewSpan.BootstrapService}',
+        attributes: { serviceSpecifier: '${serviceSpecifier}' }
+    }, () => {
+        try {
+            ${importName}({ serverData });
+        } catch(e) {
+            // add the service specifier to the error message
+            errors['${serviceSpecifier}'] = 'An SSR error occurred in bootstrap service "${serviceSpecifier}": ' + stringifyError(e);
+        }
+    });`;
+}
+function createSsrCall(rootSpecifier, ctorImportName) {
+  return `
+
+    if (!errors['${rootSpecifier}']) { // skip SSR if getServerData failed
+        const existingTaskCount${ctorImportName} = process.getActiveResourcesInfo ? process.getActiveResourcesInfo().length : 0;
+        const html${ctorImportName} = globalThis.trace({
+            name: '${import_instrumentation.ViewSpan.RenderComponent}',
+            attributes: { specifier: '${rootSpecifier}' }
         }, () => {
             try {
-                ${importName}({ serverData });
+                return renderComponent('${(0, import_shared_utils.moduleSpecifierToKebabCase)(rootSpecifier)}', ${ctorImportName}, results['${rootSpecifier}'].props || {});
             } catch(e) {
+                // add the LWC rendering stack to the error message
                 const message = e.message || stringifyError(e);
-                // we need to re-throw with the service specifier in the error message
-                throw new Error('An SSR error occurred in bootstrap service "${service}": ' + message);
+                const error = e.wcStack 
+                    ? 'An error occurred during server-side rendering for component stack: ' + e.wcStack + '. Error was: ' + message
+                    : 'An error occurred during server-side rendering: ' + message;
+                errors['${rootSpecifier}'] = error;
             }
-        });`;
-  });
-  const ssrCall = isSSR ? `
-    // 2. render component
-    result = globalThis.trace({
-        name: '${import_instrumentation.ViewSpan.RenderComponent}',
-        attributes: {
-            specifier: '${rootSpecifier}'
+        });
+        const currentTaskCount${ctorImportName} = process.getActiveResourcesInfo ? process.getActiveResourcesInfo().length : 0;
+        if (currentTaskCount${ctorImportName} - existingTaskCount${ctorImportName} > 0) {
+            console.warn('[warn] async tasks encountered while server rendering "${rootSpecifier}"');
         }
-    }, () => renderComponent('${(0, import_shared_utils.moduleSpecifierToKebabCase)(rootSpecifier)}', Ctor, props || {}));` : "";
+        Object.assign(results['${rootSpecifier}'], { html: html${ctorImportName} });
+    }`;
+}
+function createServerBootstrapModule(rootSpecifiers, isSSR, services) {
+  let rootImports = "", dataCalls = "", ssrCalls = "";
+  rootSpecifiers.forEach((root) => {
+    const ctorImportName = (0, import_shared_utils.stringToVariableName)(`Ctor_${root}`);
+    const classImportName = (0, import_shared_utils.stringToVariableName)(`root_${root}`);
+    rootImports += `
+import ${ctorImportName}, * as ${classImportName} from '${root}';`;
+    dataCalls += createDataCall(root, classImportName);
+    ssrCalls += isSSR ? createSsrCall(root, ctorImportName) : "";
+  });
+  let serviceImports = "", serviceCalls = "";
+  services.forEach((serviceSpecifier) => {
+    const importName = (0, import_shared_utils.stringToVariableName)(`service_${serviceSpecifier}`);
+    serviceImports += `
+import ${importName} from '${serviceSpecifier}';`;
+    serviceCalls += createServiceCall(serviceSpecifier, importName);
+  });
   return `
-import { renderComponent } from '@lwc/engine-server';
-import Ctor, * as rootComponent from '${rootSpecifier}';${serviceImports}
+import { renderComponent } from '@lwc/engine-server';${rootImports}${serviceImports}
 
 (async () => {
-    let result, props, markup, cache, serverData = globalThis.LWR?.serverData || {}, existingTaskCount;
-    // remove the LWR global properties before any customer code is run
+    const results = {}; // { rootSpecifier: { html, props, markup, cache } }
+    const errors = {};  // { rootSpecifier: error string }
+    const serverData = globalThis.LWR?.serverData || {}; // data from view providers
+    const context = globalThis.getContext(); // SsrRequestContext
+
+    // 1. cleanup the LWR global properties before any customer code is run
     if (globalThis.LWR?.define) {
         // AMD: support dynamic imports in getServerData
-        globalThis.LWR = Object.freeze({ define: globalThis.LWR.define });
+        globalThis.LWR = Object.freeze({ define: globalThis.LWR.define, env: globalThis.LWR.env });
     } else {
-        delete globalThis.LWR; // ESM
-    }
-
-    try {
-        // 1. setup page data
-        const context = globalThis.getContext();
-        props = context.props;
-        if (rootComponent.getServerData) {
-            const data = await globalThis.trace({
-                name: '${import_instrumentation.ViewSpan.GetServerData}',
-                attributes: {
-                    specifier: '${rootSpecifier}'
-                }
-            }, async() => {
-                try {
-                    return await rootComponent.getServerData(context)
-                } catch(e) {
-                    const message = e.message || stringifyError(e);
-                    // we need to re-throw with rootSpecifier in the error message
-                    throw new Error('Error in "getServerData" for "${rootSpecifier}": ' + message);
-                }
-            });
-            props = data.props; // overwrite public props
-            Object.assign(serverData, data.props); // add props to server data
-            markup = data.markup;
-            cache = data.cache;
-        }${serviceCalls}
-
-        existingTaskCount = process.getActiveResourcesInfo
-            ? process.getActiveResourcesInfo().length
-            : 0;${ssrCall}
-    } catch(e) {
-        const message = e.message || stringifyError(e);
-
-        // add the LWC rendering stack
-        const error = e.wcStack ? 
-        'An error occurred during server-side rendering for component stack: ' + e.wcStack + '. Error was: ' + message :
-        'An error occurred during server-side rendering: ' + message;
-            
-        // (3) relay error
-        globalThis.resolver({ error });
-    }
-
-    const currentTaskCount = process.getActiveResourcesInfo
-            ? process.getActiveResourcesInfo().length
-            : 0;
-    if (currentTaskCount - existingTaskCount > 0) {
-        console.warn('[warn] async tasks encountered while server rendering "${rootSpecifier}"');
+        // ESM
+        globalThis.LWR = Object.freeze({ env: globalThis.LWR.env });
     }
 
-    // 3. relay successful results
-    globalThis.resolver({ result, props, markup, cache });
+    // 2. pre-fetch data
+    ${dataCalls}
+    // 3. execute each SSR bootstrap service
+    ${serviceCalls}
+    // 4. render components
+    ${ssrCalls}
+    // 5. relay results
+    globalThis.resolver({ results, errors });
 })()`;
 }
 var ServerModuleProvider = class {
@@ -134,7 +143,7 @@ var ServerModuleProvider = class {
     this.routes = [...config.routes, ...config.errorRoutes];
   }
   async getModuleEntry({specifier}) {
-    if ((0, import_identity.parseSpecifier)(specifier)) {
+    if ((0, import_identity.parseBootstrapSpecifier)(specifier)) {
       const virtualId = `<virtual>/${specifier}`;
       return {
         id: `${virtualId}|${this.version}`,
@@ -150,8 +159,8 @@ var ServerModuleProvider = class {
     if (!moduleEntry) {
       return;
     }
-    const {route, rootSpecifier} = (0, import_identity.parseSpecifier)(specifier, this.routes);
-    const originalSource = createServerBootstrapModule(rootSpecifier, !!route?.bootstrap.ssr, (0, import_identity.getSsrServices)(route));
+    const {route, rootSpecifiers} = (0, import_identity.parseBootstrapSpecifier)(specifier, this.routes);
+    const originalSource = createServerBootstrapModule(rootSpecifiers, !!route?.bootstrap.ssr, (0, import_identity.getSsrServices)(route));
     return {
       id: moduleEntry.id,
       namespace,

package/build/cjs/utils/amd-utils.cjs

@@ -29,6 +29,8 @@ __export(exports, {
 });
 var import_shared_utils = __toModule(require("@lwrjs/shared-utils"));
 var import_identity = __toModule(require("../identity.cjs"));
+var import_fs_extra = __toModule(require("fs-extra"));
+var import_url = __toModule(require("url"));
 var LWC_SPECIFIERS = {csr: "lwc", ssr: "@lwc/engine-server"};
 async function readableToString(readable) {
   let result = "";
@@ -82,17 +84,19 @@ async function getCode(runtimeEnvironment, serverData, lwrVersion, bundleSpecifi
   const loaderShimSource2 = await getLoaderShim(resourceRegistry, runtimeEnvironment);
   const lwrConfigString = JSON.stringify(getLwrConfig(bundleSpecifier, lwrVersion, serverData));
   const lwcSpecifier = includedModules.find((m) => m.startsWith(`${LWC_SPECIFIERS.ssr}/v`));
+  const info = (0, import_identity.parseBootstrapSpecifier)(bundleSpecifier);
+  const rootCmpSpecifiers = info ? info.rootSpecifiers.join(",") : bundleSpecifier;
   return [
     GLOBALTHIS_LWR,
     `Object.assign(globalThis.LWR, ${lwrConfigString});`,
-    `Object.assign(globalThis.LWR, { onError: (err) => globalThis.resolver({ error: err.message })});`,
+    `Object.assign(globalThis.LWR, { onError: (err) => globalThis.resolver({ errors: { '${rootCmpSpecifiers}': err.message}})});`,
     loaderShimSource2 ? loaderShimSource2 : "",
     lwcSpecifier ? aliasLwcEngine(lwcSpecifier, LWC_SPECIFIERS) : ""
   ];
 }
 async function getBundle(specifier, moduleBundler, routes, runtimeEnvironment, runtimeParams) {
   if ((0, import_shared_utils.getFeatureFlags)().SSR_STATIC_BUNDLES) {
-    return buildBundle(specifier, moduleBundler, routes, {...runtimeEnvironment, debug: false}, runtimeParams);
+    return buildBundle(specifier, moduleBundler, routes, runtimeEnvironment, runtimeParams);
   }
   return bundle(specifier, moduleBundler, {
     ...runtimeEnvironment,
@@ -100,8 +104,28 @@ async function getBundle(specifier, moduleBundler, routes, runtimeEnvironment, r
   }, runtimeParams, {
     appendExcludes: false,
     exclude: ["lwc"]
+  }).then(async (bundle2) => {
+    bundle2.code = await appendFileBasedExternals(bundle2.code, bundle2.bundleRecord.dynamicImports, bundle2.bundleRecord.imports, new Set(), new Set());
+    return bundle2;
   });
 }
+async function appendFileBasedExternals(bundleCode, dynamicImports = [], imports = [], visitedBundles, visitedExternals) {
+  for (const {specifier, external, externalSrc} of [...imports, ...dynamicImports]) {
+    if (!visitedBundles.has(specifier) && (!external || !externalSrc || !visitedExternals.has(externalSrc))) {
+      visitedBundles.add(specifier);
+      if (external && externalSrc) {
+        visitedExternals.add(externalSrc);
+        if (externalSrc && externalSrc.startsWith(import_shared_utils.PROTOCOL_FILE)) {
+          const path = (0, import_url.fileURLToPath)(externalSrc);
+          const externalBundle = import_fs_extra.default.readFileSync(path, {encoding: "utf-8"}).toString();
+          bundleCode = bundleCode.concat(`
+${externalBundle}`);
+        }
+      }
+    }
+  }
+  return bundleCode;
+}
 async function bundle(specifier, moduleBundler, runtimeEnvironment, runtimeParams, bundleConfigOverrides) {
   return await moduleBundler.getModuleBundle({specifier}, runtimeEnvironment, runtimeParams, bundleConfigOverrides);
 }
@@ -126,8 +150,7 @@ async function bundleImports(bundleCode, dynamicImports = [], imports = [], visi
 function getBundledCode(runtimeEnvironment, specifier, version, code) {
   let bundledCode;
   if (runtimeEnvironment.featureFlags?.EXPERIMENTAL_UNVERSIONED_ALIASES) {
-    const versionedSpecifier = (0, import_shared_utils.getSpecifier)({specifier, version});
-    const aliasCode = (0, import_shared_utils.createAmdAlias)(versionedSpecifier, specifier);
+    const aliasCode = (0, import_shared_utils.createAmdAlias)((0, import_shared_utils.getSpecifier)({specifier, version}), specifier);
     bundledCode = [code, aliasCode].filter(Boolean).join("");
   } else {
     bundledCode = code;
@@ -139,18 +162,21 @@ async function getBundleWithImports(specifier, moduleBundler, runtimeEnvironment
   return await bundleImports(code, bundleRecord.dynamicImports, bundleRecord.imports, new Set(["lwc", specifier]), moduleBundler, runtimeEnvironment, runtimeParams);
 }
 async function buildBundle(ssrSpecifier, moduleBundler, routes, runtimeEnvironment, runtimeParams) {
-  const {rootSpecifier, route} = (0, import_identity.parseSpecifier)(ssrSpecifier, routes);
+  const {rootSpecifiers, route} = (0, import_identity.parseBootstrapSpecifier)(ssrSpecifier, routes);
   const ssrServices = (0, import_identity.getSsrServices)(route);
   const serviceBundles = await Promise.all(ssrServices.map((s) => getBundleWithImports(s, moduleBundler, runtimeEnvironment, runtimeParams)));
   const serviceCode = serviceBundles.reduce((all, sc) => all + sc, "");
-  let rootCode = await getBundleWithImports(rootSpecifier, moduleBundler, runtimeEnvironment, runtimeParams);
-  if (runtimeEnvironment.featureFlags?.EXPERIMENTAL_UNVERSIONED_ALIASES) {
-    const aliasSpecifier = (0, import_shared_utils.getSpecifier)({
-      specifier: rootSpecifier,
-      version: "version-not-provided"
-    });
-    const aliasCode = (0, import_shared_utils.createAmdAlias)(aliasSpecifier, rootSpecifier);
-    rootCode = [aliasCode, rootCode].join("");
+  let rootCode = "";
+  for (const rootSpecifier of rootSpecifiers) {
+    rootCode += await getBundleWithImports(rootSpecifier, moduleBundler, runtimeEnvironment, runtimeParams);
+    if (runtimeEnvironment.featureFlags?.EXPERIMENTAL_UNVERSIONED_ALIASES) {
+      const aliasSpecifier = (0, import_shared_utils.getSpecifier)({
+        specifier: rootSpecifier,
+        version: "version-not-provided"
+      });
+      const aliasCode = (0, import_shared_utils.createAmdAlias)(aliasSpecifier, rootSpecifier);
+      rootCode = [aliasCode, rootCode].join("");
+    }
   }
   const {code: lwcEngineCode, version: lwcVersion} = await bundle(LWC_SPECIFIERS.ssr, moduleBundler, runtimeEnvironment, runtimeParams);
   const {
@@ -159,7 +185,7 @@ async function buildBundle(ssrSpecifier, moduleBundler, routes, runtimeEnvironme
     version: lwrVersion
   } = await bundle(ssrSpecifier, moduleBundler, runtimeEnvironment, runtimeParams, {
     appendExcludes: true,
-    exclude: [LWC_SPECIFIERS.ssr, rootSpecifier, ...ssrServices]
+    exclude: [LWC_SPECIFIERS.ssr, ...rootSpecifiers, ...ssrServices]
   });
   const code = serviceCode + rootCode + lwcEngineCode + ssrCode;
   bundleRecord.includedModules.push(`${LWC_SPECIFIERS.ssr}/v/${(0, import_shared_utils.normalizeVersionToUri)(lwcVersion)}`);

package/build/cjs/utils/sandbox-vm.cjs

@@ -26,14 +26,13 @@ __markAsModule(exports);
 __export(exports, {
   default: () => runCode
 });
-var import_instrumentation = __toModule(require("@lwrjs/instrumentation"));
+var import_node_vm = __toModule(require("node:vm"));
 var import_crypto = __toModule(require("crypto"));
 var import_url = __toModule(require("url"));
-var import_utils = __toModule(require("./utils.cjs"));
 var import_diagnostics = __toModule(require("@lwrjs/diagnostics"));
-var import_node_vm = __toModule(require("node:vm"));
-function runCode(codes, context, host) {
-  import_diagnostics.logger.info("running vm sandbox");
+var import_instrumentation = __toModule(require("@lwrjs/instrumentation"));
+var import_utils = __toModule(require("./utils.cjs"));
+function runCode(codes, context, options) {
   return new Promise((resolve, reject) => {
     let resolver;
     const p = new Promise((r) => resolver = r);
@@ -42,26 +41,39 @@ function runCode(codes, context, host) {
     }
     const tracer = (0, import_instrumentation.getTracer)();
     const trace = tracer.trace.bind(tracer);
+    const {host, requestDepth} = options;
+    const fetchEndowment = (0, import_utils.createFetchEndowment)(trace, host, requestDepth);
+    const fetchController = new import_utils.FetchController(fetchEndowment);
     const vmContext = {
-      AbortController,
-      crypto: import_crypto.webcrypto,
       getContext,
-      trace,
-      fetch: (0, import_utils.createFetchEndowment)(host),
-      stringifyError: import_diagnostics.stringifyError,
       resolver,
+      stringifyError: import_diagnostics.stringifyError,
+      trace,
+      AbortController,
+      AbortSignal,
+      atob,
+      btoa,
+      console,
+      crypto: import_crypto.webcrypto,
+      Headers,
+      Intl,
+      fetch: fetchController.controlledFetch,
+      Request,
+      Response,
       URL: import_url.URL,
       URLSearchParams: import_url.URLSearchParams,
       process,
       setTimeout,
       clearTimeout,
       setInterval,
-      clearInterval
+      clearInterval,
+      setImmediate,
+      clearImmediate
     };
     import_node_vm.default.createContext(vmContext);
     const time = (0, import_utils.getWatchdogTime)();
     const timerId = (0, import_utils.startWatchdogTimer)(() => {
-      reject(new Error(`SSR timed out after ${time}ms`));
+      reject((0, import_diagnostics.createSingleDiagnosticError)({description: import_diagnostics.descriptions.UNRESOLVABLE.SSR_TIMEOUT(options.bundleSpecifier, time)}, import_diagnostics.LwrUnresolvableError));
     }, time);
     try {
       import_node_vm.default.runInContext(codes.join("\n"), vmContext);
@@ -70,12 +82,14 @@ function runCode(codes, context, host) {
         resolve(r);
       }).catch((e) => {
         import_diagnostics.logger.error(e);
-        (0, import_utils.stopWatchdogTimer)(timerId);
         reject(e);
+      }).finally(() => {
+        fetchController.activateKillSwitch();
       });
     } catch (e) {
       import_diagnostics.logger.error(e);
       (0, import_utils.stopWatchdogTimer)(timerId);
+      fetchController.activateKillSwitch();
       reject(e);
     }
   });

package/build/cjs/utils/sandbox.cjs

@@ -26,16 +26,11 @@ __markAsModule(exports);
 __export(exports, {
   default: () => runCode
 });
-var import_sandbox_worker = __toModule(require("./sandbox-worker.cjs"));
 var import_sandbox_vm = __toModule(require("./sandbox-vm.cjs"));
-var import_shared_utils = __toModule(require("@lwrjs/shared-utils"));
-var import_diagnostics = __toModule(require("@lwrjs/diagnostics"));
-function runCode(codes, context, bundleSpecifier, host) {
-  if (process.env.SSR_GENERATE_CODE) {
-    (0, import_sandbox_worker.generateWorkerCode)(codes, context, bundleSpecifier, host).catch((err) => import_diagnostics.logger.error(err));
+var import_ssr_debug = __toModule(require("./ssr-debug.cjs"));
+async function runCode(codes, context, options) {
+  if (process.env.SSR_DEBUG) {
+    return (0, import_ssr_debug.default)(codes, context, options);
   }
-  if ((0, import_shared_utils.getFeatureFlags)().SSR_SANDBOX_VM) {
-    return (0, import_sandbox_vm.default)(codes, context, host);
-  }
-  return (0, import_sandbox_worker.default)(codes, context, host);
+  return (0, import_sandbox_vm.default)(codes, context, options);
 }