fix: simplify and fix minimal repro

salesforce · Nov 27, 2024 · a474f3b · a474f3b
1 parent 7161ea4
commit a474f3b
Show file tree

Hide file tree

Showing 5 changed files with 14 additions and 41 deletions.
diff --git a/packages/@lwc/ssr-compiler/src/__tests__/utils/expected-failures.ts b/packages/@lwc/ssr-compiler/src/__tests__/utils/expected-failures.ts
@@ -8,7 +8,6 @@
 // We should slowly drive down these test failures or at least document where we expect the failures
 // TODO [#4815]: enable all SSR v2 tests
 export const expectedFailures = new Set([
-    'adjacent-text-nodes/preserve-comments-off/deep/index.js',
     'attribute-aria/dynamic/index.js',
     'attribute-class/with-scoped-styles-only-in-child/dynamic/index.js',
     'attribute-class/with-scoped-styles/dynamic/index.js',

diff --git a/packages/@lwc/ssr-compiler/src/compile-template/adjacent-text-nodes.ts b/packages/@lwc/ssr-compiler/src/compile-template/adjacent-text-nodes.ts
@@ -4,8 +4,8 @@
  * SPDX-License-Identifier: MIT
  * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
  */
-import { esTemplate, esTemplateWithYield } from '../estemplate';
-import type { BlockStatement as EsBlockStatement, Statement as EsStatement } from 'estree';
+import { esTemplateWithYield } from '../estemplate';
+import type { BlockStatement as EsBlockStatement } from 'estree';
 import type { TransformerContext } from './types';
 import type { Node as IrNode } from '@lwc/template-compiler';
 
@@ -25,15 +25,6 @@ const isConcatenatedNode = (node: IrNode, cxt: TransformerContext) => {
     }
 };
 
-export const isFirstConcatenatedNode = (cxt: TransformerContext) => {
-    const { prevSibling } = cxt;
-    if (!prevSibling) {
-        // we are the first sibling
-        return true;
-    }
-    return !isConcatenatedNode(prevSibling, cxt);
-};
-
 export const isLastConcatenatedNode = (cxt: TransformerContext) => {
     const { nextSibling } = cxt;
     if (!nextSibling) {
@@ -43,18 +34,15 @@ export const isLastConcatenatedNode = (cxt: TransformerContext) => {
     return !isConcatenatedNode(nextSibling, cxt);
 };
 
-export const bDeclareTextContentBuffer = esTemplate`
-    // Deliberately using var so we can re-declare as many times as we want in the same scope
-    var textContentBuffer = '';
-    var didBufferTextContent = false;
-`<EsStatement[]>;
-
 export const bYieldTextContent = esTemplateWithYield`
     if (didBufferTextContent) {
         // We are at the end of a series of text nodes - flush to a concatenated string
         // We only render the ZWJ if there were actually any dynamic text nodes rendered
         // The ZWJ is just so hydration can compare the SSR'd dynamic text content against
         // the CSR'd text content.
         yield textContentBuffer === '' ? '\u200D' : htmlEscape(textContentBuffer);
+        // Reset
+        textContentBuffer = '';
+        didBufferTextContent = false;
     }
 `<EsBlockStatement>;
diff --git a/packages/@lwc/ssr-compiler/src/compile-template/index.ts b/packages/@lwc/ssr-compiler/src/compile-template/index.ts
@@ -28,6 +28,11 @@ const bExportTemplate = esTemplate`
             Cmp, 
             instance
     ) {
+        // Deliberately using let so we can mutate as many times as we want in the same scope.
+        // These should be scoped to the "tmpl" function however, to avoid conflicts with other templates.
+        let textContentBuffer = '';
+        let didBufferTextContent = false;
+
         const isLightDom = Cmp.renderMode === 'light';
         if (!isLightDom) {
             yield \`<template shadowrootmode="open"\${Cmp.delegatesFocus ? ' shadowrootdelegatesfocus' : ''}>\`

diff --git a/packages/@lwc/ssr-compiler/src/compile-template/transformers/comment.ts b/packages/@lwc/ssr-compiler/src/compile-template/transformers/comment.ts
@@ -7,12 +7,7 @@
 
 import { builders as b } from 'estree-toolkit';
 
-import {
-    bDeclareTextContentBuffer,
-    bYieldTextContent,
-    isFirstConcatenatedNode,
-    isLastConcatenatedNode,
-} from '../adjacent-text-nodes';
+import { bYieldTextContent, isLastConcatenatedNode } from '../adjacent-text-nodes';
 import type { Comment as IrComment } from '@lwc/template-compiler';
 import type { Transformer } from '../types';
 
@@ -22,15 +17,11 @@ export const Comment: Transformer<IrComment> = function Comment(node, cxt) {
     } else {
         cxt.import('htmlEscape');
 
-        const isFirstInSeries = isFirstConcatenatedNode(cxt);
         const isLastInSeries = isLastConcatenatedNode(cxt);
 
         // If preserve comments is off, we check if we should flush text content
         // for adjacent text nodes. (If preserve comments is on, then the previous
         // text node already flushed.)
-        return [
-            ...(isFirstInSeries ? bDeclareTextContentBuffer() : []),
-            ...(isLastInSeries ? [bYieldTextContent()] : []),
-        ];
+        return [...(isLastInSeries ? [bYieldTextContent()] : [])];
     }
 };
diff --git a/packages/@lwc/ssr-compiler/src/compile-template/transformers/text.ts b/packages/@lwc/ssr-compiler/src/compile-template/transformers/text.ts
@@ -9,12 +9,7 @@ import { builders as b, is } from 'estree-toolkit';
 import { esTemplateWithYield } from '../../estemplate';
 import { expressionIrToEs } from '../expression';
 
-import {
-    bDeclareTextContentBuffer,
-    bYieldTextContent,
-    isFirstConcatenatedNode,
-    isLastConcatenatedNode,
-} from '../adjacent-text-nodes';
+import { bYieldTextContent, isLastConcatenatedNode } from '../adjacent-text-nodes';
 import type { Statement as EsStatement } from 'estree';
 import type {
     ComplexExpression as IrComplexExpression,
@@ -41,16 +36,11 @@ function isLiteral(node: IrLiteral | IrExpression | IrComplexExpression): node i
 export const Text: Transformer<IrText> = function Text(node, cxt): EsStatement[] {
     cxt.import('htmlEscape');
 
-    const isFirstInSeries = isFirstConcatenatedNode(cxt);
     const isLastInSeries = isLastConcatenatedNode(cxt);
 
     const valueToYield = isLiteral(node.value)
         ? b.literal(node.value.value)
         : expressionIrToEs(node.value, cxt);
 
-    return [
-        ...(isFirstInSeries ? bDeclareTextContentBuffer() : []),
-        ...bBufferTextContent(valueToYield),
-        ...(isLastInSeries ? [bYieldTextContent()] : []),
-    ];
+    return [...bBufferTextContent(valueToYield), ...(isLastInSeries ? [bYieldTextContent()] : [])];
 };