diff --git a/packages/@lwc/ssr-compiler/src/compile-js/generate-markup.ts b/packages/@lwc/ssr-compiler/src/compile-js/generate-markup.ts index 7a5b92b5ce..9b5fe4d080 100644 --- a/packages/@lwc/ssr-compiler/src/compile-js/generate-markup.ts +++ b/packages/@lwc/ssr-compiler/src/compile-js/generate-markup.ts @@ -13,13 +13,13 @@ import { bImportDeclaration } from '../estree/builders'; import { bWireAdaptersPlumbing } from './wire'; import type { - BlockStatement, ExportNamedDeclaration, Program, SimpleCallExpression, Identifier, MemberExpression, Statement, + ExpressionStatement, } from 'estree'; import type { ComponentMetaState } from './types'; @@ -68,10 +68,8 @@ const bGenerateMarkup = esTemplate` `; const bAssignGenerateMarkupToComponentClass = esTemplate` - { - ${/* lwcClassName */ is.identifier}[__SYMBOL__GENERATE_MARKUP] = generateMarkup; - } -`; +${/* lwcClassName */ is.identifier}[__SYMBOL__GENERATE_MARKUP] = generateMarkup; +`; /** * This builds a generator function `generateMarkup` and adds it to the component JS's diff --git a/packages/@lwc/ssr-compiler/src/compile-js/stylesheet-scope-token.ts b/packages/@lwc/ssr-compiler/src/compile-js/stylesheet-scope-token.ts index 4b22ce225b..54c4037a3b 100644 --- a/packages/@lwc/ssr-compiler/src/compile-js/stylesheet-scope-token.ts +++ b/packages/@lwc/ssr-compiler/src/compile-js/stylesheet-scope-token.ts @@ -9,7 +9,7 @@ import { is } from 'estree-toolkit'; import { generateScopeTokens } from '@lwc/template-compiler'; import { builders as b } from 'estree-toolkit/dist/builders'; import { esTemplate } from '../estemplate'; -import type { BlockStatement, Program, VariableDeclaration } from 'estree'; +import type { ExpressionStatement, Program, VariableDeclaration } from 'estree'; const bStylesheetTokenDeclaration = esTemplate` const stylesheetScopeToken = '${is.literal}'; @@ -23,11 +23,9 @@ const bHasScopedStylesheetsDeclaration = esTemplate` // We also need to keep track of whether the template has any scoped styles or not so that we can render (or not) the // scope token. const tmplAssignmentBlock = esTemplate` - { - ${/* template */ is.identifier}.hasScopedStylesheets = hasScopedStylesheets; - ${/* template */ 0}.stylesheetScopeToken = stylesheetScopeToken; - } -`; +${/* template */ is.identifier}.hasScopedStylesheets = hasScopedStylesheets; +${/* template */ 0}.stylesheetScopeToken = stylesheetScopeToken; +`; export function addScopeTokenDeclarations( program: Program, @@ -42,5 +40,5 @@ export function addScopeTokenDeclarations( bHasScopedStylesheetsDeclaration() ); - program.body.push(tmplAssignmentBlock(b.identifier('tmpl'))); + program.body.push(...tmplAssignmentBlock(b.identifier('tmpl'))); } diff --git a/packages/@lwc/ssr-compiler/src/compile-template/transformers/element.ts b/packages/@lwc/ssr-compiler/src/compile-template/transformers/element.ts index a398910105..c31f934ca8 100644 --- a/packages/@lwc/ssr-compiler/src/compile-template/transformers/element.ts +++ b/packages/@lwc/ssr-compiler/src/compile-template/transformers/element.ts @@ -31,6 +31,7 @@ import type { BlockStatement as EsBlockStatement, Expression as EsExpression, Statement as EsStatement, + IfStatement as EsIfStatement, } from 'estree'; import type { Transformer, TransformerContext } from '../types'; @@ -89,13 +90,10 @@ const bStringLiteralYield = esTemplateWithYield` `; const bConditionallyYieldScopeTokenClass = esTemplateWithYield` - { - const shouldRenderScopeToken = hasScopedStylesheets || hasScopedStaticStylesheets(Cmp); - if (shouldRenderScopeToken) { - yield \` class="\${stylesheetScopeToken}"\`; - } + if (hasScopedStylesheets || hasScopedStaticStylesheets(Cmp)) { + yield \` class="\${stylesheetScopeToken}"\`; } -`; +`; const bYieldSanitizedHtml = esTemplateWithYield` yield sanitizeHtmlContent(${/* lwc:inner-html content */ is.expression})