@lwc/ssr-compiler 8.12.7 → 8.13.0

package/dist/compile-js/index.d.ts

@@ -1,5 +1,5 @@
+import { type CompilationMode } from '@lwc/shared';
 import type { ComponentTransformOptions } from '../shared';
-import type { CompilationMode } from '@lwc/shared';
 export default function compileJS(src: string, filename: string, tagName: string, options: ComponentTransformOptions, compilationMode: CompilationMode): {
     code: string;
 };

package/dist/index.cjs.js

@@ -738,8 +738,9 @@ function bWireAdaptersPlumbing(adapters) {
  */
 const bGenerateMarkup = (esTemplate `
     // These variables may mix with component-authored variables, so should be reasonably unique
-    const __lwcPublicProperties__ = new Set(${ /*api*/estreeToolkit.is.arrayExpression});
-    const __lwcPrivateProperties__ = new Set(${ /*private fields*/estreeToolkit.is.arrayExpression});
+    const __lwcSuperPublicProperties__ = Array.from(Object.getPrototypeOf(${ /* Component class */estreeToolkit.is.identifier})?.__lwcPublicProperties__?.values?.() ?? []);
+    const __lwcPublicProperties__ = new Set(${ /*public properties*/estreeToolkit.is.arrayExpression}.concat(__lwcSuperPublicProperties__));
+    const __lwcPrivateProperties__ = new Set(${ /*private properties*/estreeToolkit.is.arrayExpression});
 
     async function* generateMarkup(
             tagName, 
@@ -755,7 +756,7 @@ const bGenerateMarkup = (esTemplate `
         tagName = tagName ?? ${ /*component tag name*/estreeToolkit.is.literal};
         attrs = attrs ?? Object.create(null);
         props = props ?? Object.create(null);
-        const instance = new ${ /* Component class */estreeToolkit.is.identifier}({
+        const instance = new ${ /* Component class */0}({
             tagName: tagName.toUpperCase(),
         });
 
@@ -777,12 +778,12 @@ const bGenerateMarkup = (esTemplate `
         // If a render() function is defined on the class or any of its superclasses, then that takes priority.
         // Next, if the class or any of its superclasses has an implicitly-associated template, then that takes
         // second priority (e.g. a foo.html file alongside a foo.js file). Finally, there is a fallback empty template.
-        const tmplFn = instance.render?.() ?? ${ /*component class*/3}[__SYMBOL__DEFAULT_TEMPLATE] ?? __fallbackTmpl;
+        const tmplFn = instance.render?.() ?? ${ /*component class*/0}[__SYMBOL__DEFAULT_TEMPLATE] ?? __fallbackTmpl;
         yield \`<\${tagName}\`;
 
         const hostHasScopedStylesheets =
             tmplFn.hasScopedStylesheets ||
-            hasScopedStaticStylesheets(${ /*component class*/3});
+            hasScopedStaticStylesheets(${ /*component class*/0});
         const hostScopeToken = hostHasScopedStylesheets ? tmplFn.stylesheetScopeToken + "-host" : undefined;
 
         yield* __renderAttrs(instance, attrs, hostScopeToken, scopeToken);
@@ -791,12 +792,13 @@ const bGenerateMarkup = (esTemplate `
             shadowSlottedContent,
             lightSlottedContent,
             scopedSlottedContent,
-            ${ /*component class*/3},
+            ${ /*component class*/0},
             instance
         );
         yield \`</\${tagName}>\`;
     }
-    ${ /* component class */3}[__SYMBOL__GENERATE_MARKUP] = generateMarkup;
+    ${ /* component class */0}[__SYMBOL__GENERATE_MARKUP] = generateMarkup;
+    ${ /* component class */0}.__lwcPublicProperties__ = __lwcPublicProperties__;
 `);
 const bExposeTemplate = (esTemplate `
     if (${ /*template*/estreeToolkit.is.identifier}) {
@@ -846,7 +848,7 @@ function addGenerateMarkupFunction(program, state, tagName, filename) {
         SYMBOL__SET_INTERNALS: '__SYMBOL__SET_INTERNALS',
         establishContextfulRelationship: '__establishContextfulRelationship',
     }));
-    program.body.push(...bGenerateMarkup(estreeToolkit.builders.arrayExpression(publicProperties.map(estreeToolkit.builders.literal)), estreeToolkit.builders.arrayExpression(privateProperties.map(estreeToolkit.builders.literal)), defaultTagName, classIdentifier, connectWireAdapterCode));
+    program.body.push(...bGenerateMarkup(classIdentifier, estreeToolkit.builders.arrayExpression(publicProperties.map(estreeToolkit.builders.literal)), estreeToolkit.builders.arrayExpression(privateProperties.map(estreeToolkit.builders.literal)), defaultTagName, connectWireAdapterCode));
     if (exposeTemplateBlock) {
         program.body.push(exposeTemplateBlock);
     }
@@ -935,6 +937,19 @@ const visitors = {
                 node.id = estreeToolkit.builders.identifier('DefaultComponentName');
                 state.lwcClassName = 'DefaultComponentName';
             }
+            // There's no builder for comment nodes :\
+            const lwcVersionComment = {
+                type: 'Block',
+                value: shared.LWC_VERSION_COMMENT,
+            };
+            // Add LWC version comment to end of class body
+            const { body } = node;
+            if (body.trailingComments) {
+                body.trailingComments.push(lwcVersionComment);
+            }
+            else {
+                body.trailingComments = [lwcVersionComment];
+            }
         }
     },
     PropertyDefinition(path, state) {
@@ -1042,7 +1057,12 @@ const visitors = {
                 break;
         }
     },
-    Super(path, _state) {
+    Super(path, state) {
+        // If we mutate any super calls that are piped through this compiler, then we'll be
+        // inadvertently mutating things like Wire adapters.
+        if (!state.isLWC) {
+            return;
+        }
         const parentFn = path.getFunctionParent();
         if (parentFn &&
             parentFn.parentPath?.node?.type === 'MethodDefinition' &&
@@ -1121,7 +1141,11 @@ function compileJS(src, filename, tagName, options, compilationMode) {
         ast = transmogrify(ast, compilationMode);
     }
     return {
-        code: astring.generate(ast, {}),
+        code: astring.generate(ast, {
+            // The AST generated by meriyah doesn't seem to include comments,
+            // so this just preserves the LWC version comment we added
+            comments: true,
+        }),
     };
 }
 
@@ -1657,24 +1681,31 @@ const bYieldFromChildGenerator = (esTemplateWithYield `
     Slotted content is inserted here.
     Note that the slotted content will be stored in variables named
     `shadowSlottedContent`/`lightSlottedContentMap / scopedSlottedContentMap` which are used below
-    when the child's generateMarkup function is invoked.
+when the child's generateMarkup function is invoked.
 */
 estreeToolkit.is.statement}
 
         const scopeToken = hasScopedStylesheets ? stylesheetScopeToken : undefined;
-        const Ctor = ${ /* Component */estreeToolkit.is.identifier};
-
-        yield* Ctor[__SYMBOL__GENERATE_MARKUP](
-            ${ /* tag name */estreeToolkit.is.literal}, 
-            childProps, 
-            childAttrs, 
-            shadowSlottedContent,
-            lightSlottedContentMap,
-            scopedSlottedContentMap,
-            instance,
-            scopeToken,
-            contextfulParent
-        );
+        const generateMarkup = ${ /* Component */estreeToolkit.is.identifier}[__SYMBOL__GENERATE_MARKUP];
+        const tagName = ${ /* tag name */estreeToolkit.is.literal};
+
+        if (generateMarkup) {
+            yield* generateMarkup(
+                tagName, 
+                childProps, 
+                childAttrs, 
+                shadowSlottedContent,
+                lightSlottedContentMap,
+                scopedSlottedContentMap,
+                instance,
+                scopeToken,
+                contextfulParent
+            );
+        } else {
+            yield \`<\${tagName}>\`;
+            yield* __fallbackTmpl(shadowSlottedContent, lightSlottedContentMap, scopedSlottedContentMap, ${ /* Component */3}, instance)
+            yield \`</\${tagName}>\`;
+        }
     }
 `);
 const Component = function Component(node, cxt) {
@@ -1684,6 +1715,7 @@ const Component = function Component(node, cxt) {
     cxt.import({ default: childComponentLocalName }, importPath);
     cxt.import({
         SYMBOL__GENERATE_MARKUP: '__SYMBOL__GENERATE_MARKUP',
+        fallbackTmpl: '__fallbackTmpl',
     });
     const childTagName = node.name;
     return [
@@ -2038,11 +2070,12 @@ const ForOf = function ForEach(node, cxt) {
 const LegacyIf = function If(node, cxt) {
     const { modifier: trueOrFalseAsStr, condition, children } = node;
     const trueOrFalse = trueOrFalseAsStr === 'true';
-    // FIXME: Does engine-server actually do triple-equals here?
-    const comparison = estreeToolkit.builders.binaryExpression('===', estreeToolkit.builders.literal(trueOrFalse), expressionIrToEs(condition, cxt));
+    const test = trueOrFalse
+        ? expressionIrToEs(condition, cxt)
+        : estreeToolkit.builders.unaryExpression('!', expressionIrToEs(condition, cxt));
     const childStatements = irChildrenToEs(children, cxt);
     const block = estreeToolkit.builders.blockStatement(optimizeAdjacentYieldStmts(childStatements));
-    return [estreeToolkit.builders.ifStatement(comparison, block)];
+    return [estreeToolkit.builders.ifStatement(test, block)];
 };
 
 /*
@@ -2369,17 +2402,15 @@ function compileTemplate(src, filename, options, compilationMode) {
         experimentalDynamicDirective: options.experimentalDynamicDirective,
     });
     if (!root || warnings.length) {
-        let fatal = !root;
         for (const warning of warnings) {
             // eslint-disable-next-line no-console
             console.error('Cannot compile:', warning.message);
-            if (warning.level === errors.DiagnosticLevel.Fatal ||
-                warning.level === errors.DiagnosticLevel.Error) {
-                fatal = true;
-            }
         }
-        // || !root is just used here to make TypeScript happy
-        if (fatal || !root) {
+        // The legacy SSR implementation would not bail from compilation even if a
+        // DiagnosticLevel.Fatal error was encountered. It would only fail if the
+        // template parser failed to return a root node. That behavior is duplicated
+        // here.
+        if (!root) {
             throw new Error('Template compilation failure; see warnings in the console.');
         }
     }
@@ -2422,5 +2453,5 @@ function compileTemplateForSSR(src, filename, options, mode = shared.DEFAULT_SSR
 
 exports.compileComponentForSSR = compileComponentForSSR;
 exports.compileTemplateForSSR = compileTemplateForSSR;
-/** version: 8.12.7 */
+/** version: 8.13.0 */
 //# sourceMappingURL=index.cjs.js.map

package/dist/index.js

@@ -1,11 +1,11 @@
 /**
  * Copyright (c) 2025 Salesforce, Inc.
  */
-import { normalizeStyleAttributeValue, StringReplace, StringTrim, entries, isUndefined, HTML_NAMESPACE, isVoidElement, isBooleanAttribute, generateCustomElementTagName, DEFAULT_SSR_MODE } from '@lwc/shared';
+import { LWC_VERSION_COMMENT, normalizeStyleAttributeValue, StringReplace, StringTrim, entries, isUndefined, HTML_NAMESPACE, isVoidElement, isBooleanAttribute, DEFAULT_SSR_MODE, generateCustomElementTagName } from '@lwc/shared';
 import { generate } from 'astring';
 import { builders, traverse, is } from 'estree-toolkit';
 import { parseModule } from 'meriyah';
-import { generateCompilerError, DecoratorErrors, DiagnosticLevel } from '@lwc/errors';
+import { generateCompilerError, DecoratorErrors } from '@lwc/errors';
 import { produce } from 'immer';
 import { parse as parse$1 } from 'node:path';
 import { parse } from 'acorn';
@@ -734,8 +734,9 @@ function bWireAdaptersPlumbing(adapters) {
  */
 const bGenerateMarkup = (esTemplate `
     // These variables may mix with component-authored variables, so should be reasonably unique
-    const __lwcPublicProperties__ = new Set(${ /*api*/is.arrayExpression});
-    const __lwcPrivateProperties__ = new Set(${ /*private fields*/is.arrayExpression});
+    const __lwcSuperPublicProperties__ = Array.from(Object.getPrototypeOf(${ /* Component class */is.identifier})?.__lwcPublicProperties__?.values?.() ?? []);
+    const __lwcPublicProperties__ = new Set(${ /*public properties*/is.arrayExpression}.concat(__lwcSuperPublicProperties__));
+    const __lwcPrivateProperties__ = new Set(${ /*private properties*/is.arrayExpression});
 
     async function* generateMarkup(
             tagName, 
@@ -751,7 +752,7 @@ const bGenerateMarkup = (esTemplate `
         tagName = tagName ?? ${ /*component tag name*/is.literal};
         attrs = attrs ?? Object.create(null);
         props = props ?? Object.create(null);
-        const instance = new ${ /* Component class */is.identifier}({
+        const instance = new ${ /* Component class */0}({
             tagName: tagName.toUpperCase(),
         });
 
@@ -773,12 +774,12 @@ const bGenerateMarkup = (esTemplate `
         // If a render() function is defined on the class or any of its superclasses, then that takes priority.
         // Next, if the class or any of its superclasses has an implicitly-associated template, then that takes
         // second priority (e.g. a foo.html file alongside a foo.js file). Finally, there is a fallback empty template.
-        const tmplFn = instance.render?.() ?? ${ /*component class*/3}[__SYMBOL__DEFAULT_TEMPLATE] ?? __fallbackTmpl;
+        const tmplFn = instance.render?.() ?? ${ /*component class*/0}[__SYMBOL__DEFAULT_TEMPLATE] ?? __fallbackTmpl;
         yield \`<\${tagName}\`;
 
         const hostHasScopedStylesheets =
             tmplFn.hasScopedStylesheets ||
-            hasScopedStaticStylesheets(${ /*component class*/3});
+            hasScopedStaticStylesheets(${ /*component class*/0});
         const hostScopeToken = hostHasScopedStylesheets ? tmplFn.stylesheetScopeToken + "-host" : undefined;
 
         yield* __renderAttrs(instance, attrs, hostScopeToken, scopeToken);
@@ -787,12 +788,13 @@ const bGenerateMarkup = (esTemplate `
             shadowSlottedContent,
             lightSlottedContent,
             scopedSlottedContent,
-            ${ /*component class*/3},
+            ${ /*component class*/0},
             instance
         );
         yield \`</\${tagName}>\`;
     }
-    ${ /* component class */3}[__SYMBOL__GENERATE_MARKUP] = generateMarkup;
+    ${ /* component class */0}[__SYMBOL__GENERATE_MARKUP] = generateMarkup;
+    ${ /* component class */0}.__lwcPublicProperties__ = __lwcPublicProperties__;
 `);
 const bExposeTemplate = (esTemplate `
     if (${ /*template*/is.identifier}) {
@@ -842,7 +844,7 @@ function addGenerateMarkupFunction(program, state, tagName, filename) {
         SYMBOL__SET_INTERNALS: '__SYMBOL__SET_INTERNALS',
         establishContextfulRelationship: '__establishContextfulRelationship',
     }));
-    program.body.push(...bGenerateMarkup(builders.arrayExpression(publicProperties.map(builders.literal)), builders.arrayExpression(privateProperties.map(builders.literal)), defaultTagName, classIdentifier, connectWireAdapterCode));
+    program.body.push(...bGenerateMarkup(classIdentifier, builders.arrayExpression(publicProperties.map(builders.literal)), builders.arrayExpression(privateProperties.map(builders.literal)), defaultTagName, connectWireAdapterCode));
     if (exposeTemplateBlock) {
         program.body.push(exposeTemplateBlock);
     }
@@ -931,6 +933,19 @@ const visitors = {
                 node.id = builders.identifier('DefaultComponentName');
                 state.lwcClassName = 'DefaultComponentName';
             }
+            // There's no builder for comment nodes :\
+            const lwcVersionComment = {
+                type: 'Block',
+                value: LWC_VERSION_COMMENT,
+            };
+            // Add LWC version comment to end of class body
+            const { body } = node;
+            if (body.trailingComments) {
+                body.trailingComments.push(lwcVersionComment);
+            }
+            else {
+                body.trailingComments = [lwcVersionComment];
+            }
         }
     },
     PropertyDefinition(path, state) {
@@ -1038,7 +1053,12 @@ const visitors = {
                 break;
         }
     },
-    Super(path, _state) {
+    Super(path, state) {
+        // If we mutate any super calls that are piped through this compiler, then we'll be
+        // inadvertently mutating things like Wire adapters.
+        if (!state.isLWC) {
+            return;
+        }
         const parentFn = path.getFunctionParent();
         if (parentFn &&
             parentFn.parentPath?.node?.type === 'MethodDefinition' &&
@@ -1117,7 +1137,11 @@ function compileJS(src, filename, tagName, options, compilationMode) {
         ast = transmogrify(ast, compilationMode);
     }
     return {
-        code: generate(ast, {}),
+        code: generate(ast, {
+            // The AST generated by meriyah doesn't seem to include comments,
+            // so this just preserves the LWC version comment we added
+            comments: true,
+        }),
     };
 }
 
@@ -1653,24 +1677,31 @@ const bYieldFromChildGenerator = (esTemplateWithYield `
     Slotted content is inserted here.
     Note that the slotted content will be stored in variables named
     `shadowSlottedContent`/`lightSlottedContentMap / scopedSlottedContentMap` which are used below
-    when the child's generateMarkup function is invoked.
+when the child's generateMarkup function is invoked.
 */
 is.statement}
 
         const scopeToken = hasScopedStylesheets ? stylesheetScopeToken : undefined;
-        const Ctor = ${ /* Component */is.identifier};
+        const generateMarkup = ${ /* Component */is.identifier}[__SYMBOL__GENERATE_MARKUP];
+        const tagName = ${ /* tag name */is.literal};
 
-        yield* Ctor[__SYMBOL__GENERATE_MARKUP](
-            ${ /* tag name */is.literal}, 
-            childProps, 
-            childAttrs, 
-            shadowSlottedContent,
-            lightSlottedContentMap,
-            scopedSlottedContentMap,
-            instance,
-            scopeToken,
-            contextfulParent
-        );
+        if (generateMarkup) {
+            yield* generateMarkup(
+                tagName, 
+                childProps, 
+                childAttrs, 
+                shadowSlottedContent,
+                lightSlottedContentMap,
+                scopedSlottedContentMap,
+                instance,
+                scopeToken,
+                contextfulParent
+            );
+        } else {
+            yield \`<\${tagName}>\`;
+            yield* __fallbackTmpl(shadowSlottedContent, lightSlottedContentMap, scopedSlottedContentMap, ${ /* Component */3}, instance)
+            yield \`</\${tagName}>\`;
+        }
     }
 `);
 const Component = function Component(node, cxt) {
@@ -1680,6 +1711,7 @@ const Component = function Component(node, cxt) {
     cxt.import({ default: childComponentLocalName }, importPath);
     cxt.import({
         SYMBOL__GENERATE_MARKUP: '__SYMBOL__GENERATE_MARKUP',
+        fallbackTmpl: '__fallbackTmpl',
     });
     const childTagName = node.name;
     return [
@@ -2034,11 +2066,12 @@ const ForOf = function ForEach(node, cxt) {
 const LegacyIf = function If(node, cxt) {
     const { modifier: trueOrFalseAsStr, condition, children } = node;
     const trueOrFalse = trueOrFalseAsStr === 'true';
-    // FIXME: Does engine-server actually do triple-equals here?
-    const comparison = builders.binaryExpression('===', builders.literal(trueOrFalse), expressionIrToEs(condition, cxt));
+    const test = trueOrFalse
+        ? expressionIrToEs(condition, cxt)
+        : builders.unaryExpression('!', expressionIrToEs(condition, cxt));
     const childStatements = irChildrenToEs(children, cxt);
     const block = builders.blockStatement(optimizeAdjacentYieldStmts(childStatements));
-    return [builders.ifStatement(comparison, block)];
+    return [builders.ifStatement(test, block)];
 };
 
 /*
@@ -2365,17 +2398,15 @@ function compileTemplate(src, filename, options, compilationMode) {
         experimentalDynamicDirective: options.experimentalDynamicDirective,
     });
     if (!root || warnings.length) {
-        let fatal = !root;
         for (const warning of warnings) {
             // eslint-disable-next-line no-console
             console.error('Cannot compile:', warning.message);
-            if (warning.level === DiagnosticLevel.Fatal ||
-                warning.level === DiagnosticLevel.Error) {
-                fatal = true;
-            }
         }
-        // || !root is just used here to make TypeScript happy
-        if (fatal || !root) {
+        // The legacy SSR implementation would not bail from compilation even if a
+        // DiagnosticLevel.Fatal error was encountered. It would only fail if the
+        // template parser failed to return a root node. That behavior is duplicated
+        // here.
+        if (!root) {
             throw new Error('Template compilation failure; see warnings in the console.');
         }
     }
@@ -2417,5 +2448,5 @@ function compileTemplateForSSR(src, filename, options, mode = DEFAULT_SSR_MODE)
 }
 
 export { compileComponentForSSR, compileTemplateForSSR };
-/** version: 8.12.7 */
+/** version: 8.13.0 */
 //# sourceMappingURL=index.js.map

package/package.json

@@ -4,7 +4,7 @@
         "You can safely modify dependencies, devDependencies, keywords, etc., but other props will be overwritten."
     ],
     "name": "@lwc/ssr-compiler",
-    "version": "8.12.7",
+    "version": "8.13.0",
     "description": "Compile component for use during server-side rendering",
     "keywords": [
         "compiler",
@@ -49,9 +49,9 @@
     },
     "dependencies": {
         "@babel/types": "7.26.7",
-        "@lwc/shared": "8.12.7",
-        "@lwc/errors": "8.12.7",
-        "@lwc/template-compiler": "8.12.7",
+        "@lwc/shared": "8.13.0",
+        "@lwc/errors": "8.13.0",
+        "@lwc/template-compiler": "8.13.0",
         "acorn": "8.14.0",
         "astring": "^1.9.0",
         "estree-toolkit": "^1.7.8",
@@ -59,7 +59,7 @@
         "meriyah": "^5.0.0"
     },
     "devDependencies": {
-        "@lwc/babel-plugin-component": "8.12.7",
+        "@lwc/babel-plugin-component": "8.13.0",
         "@types/estree": "^1.0.6"
     }
 }