fix(ssr): adjacent text in <template>s (#4984)

Co-authored-by: Will Harney <[email protected]>
Co-authored-by: John Hefferman <[email protected]>

packages/@lwc/engine-server/src/__tests__/fixtures/adjacent-text-nodes/preserve-comments-off/deep-for-each-with-rendered-item/expected.html

@@ -0,0 +1,9 @@
+<x-comments-text>
+  <template shadowrootmode="open">
+    ab
+    <div data-foo="1">
+      c
+    </div>
+    de
+  </template>
+</x-comments-text>

packages/@lwc/engine-server/src/__tests__/fixtures/adjacent-text-nodes/preserve-comments-off/deep-for-each-with-rendered-item/index.js

@@ -0,0 +1,3 @@
+export const tagName = 'x-comments-text';
+export { default } from 'x/comments-text';
+export * from 'x/comments-text';

packages/@lwc/engine-server/src/__tests__/fixtures/adjacent-text-nodes/preserve-comments-off/deep-for-each-with-rendered-item/modules/x/comments-text/comments-text.html

@@ -0,0 +1,9 @@
+<template>
+    a
+    <template for:each={items} for:item="item">
+        b
+        <div key={item} data-foo={item}>c</div>
+        d
+    </template>
+    e
+</template>

packages/@lwc/engine-server/src/__tests__/fixtures/adjacent-text-nodes/preserve-comments-off/deep-for-each-with-rendered-item/modules/x/comments-text/comments-text.js

@@ -0,0 +1,5 @@
+import { LightningElement } from 'lwc';
+
+export default class extends LightningElement {
+    items = [1];
+}

packages/@lwc/engine-server/src/__tests__/fixtures/adjacent-text-nodes/preserve-comments-off/deep-for-each/expected.html

@@ -0,0 +1,9 @@
+<x-comments-text>
+  <template shadowrootmode="open">
+    ab
+    <div>
+      c
+    </div>
+    de
+  </template>
+</x-comments-text>

packages/@lwc/engine-server/src/__tests__/fixtures/adjacent-text-nodes/preserve-comments-off/deep-for-each/index.js

@@ -0,0 +1,3 @@
+export const tagName = 'x-comments-text';
+export { default } from 'x/comments-text';
+export * from 'x/comments-text';

packages/@lwc/engine-server/src/__tests__/fixtures/adjacent-text-nodes/preserve-comments-off/deep-for-each/modules/x/comments-text/comments-text.html

@@ -0,0 +1,9 @@
+<template>
+    a
+    <template for:each={items} for:item="item">
+        b
+        <div key={item}>c</div>
+        d
+    </template>
+    e
+</template>

packages/@lwc/engine-server/src/__tests__/fixtures/adjacent-text-nodes/preserve-comments-off/deep-for-each/modules/x/comments-text/comments-text.js

@@ -0,0 +1,5 @@
+import { LightningElement } from 'lwc';
+
+export default class extends LightningElement {
+    items = [1];
+}

packages/@lwc/engine-server/src/__tests__/fixtures/adjacent-text-nodes/preserve-comments-off/deep-iterator/expected.html

@@ -0,0 +1,9 @@
+<x-comments-text>
+  <template shadowrootmode="open">
+    ab
+    <div>
+      c
+    </div>
+    de
+  </template>
+</x-comments-text>

packages/@lwc/engine-server/src/__tests__/fixtures/adjacent-text-nodes/preserve-comments-off/deep-iterator/index.js

@@ -0,0 +1,3 @@
+export const tagName = 'x-comments-text';
+export { default } from 'x/comments-text';
+export * from 'x/comments-text';

packages/@lwc/engine-server/src/__tests__/fixtures/adjacent-text-nodes/preserve-comments-off/deep-iterator/modules/x/comments-text/comments-text.html

@@ -0,0 +1,9 @@
+<template>
+    a
+    <template iterator:it={items}>
+        b
+        <div key={it.value}>c</div>
+        d
+    </template>
+    e
+</template>

packages/@lwc/engine-server/src/__tests__/fixtures/adjacent-text-nodes/preserve-comments-off/deep-iterator/modules/x/comments-text/comments-text.js

@@ -0,0 +1,5 @@
+import { LightningElement } from 'lwc';
+
+export default class extends LightningElement {
+    items = [1];
+}

packages/@lwc/ssr-compiler/src/__tests__/utils/expected-failures.ts

@@ -8,7 +8,7 @@
 // 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/deep2/index.js',
+    'adjacent-text-nodes/preserve-comments-off/deep-for-each-with-rendered-item/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',
@@ -29,7 +29,6 @@ export const expectedFailures = new Set([
     'scoped-slots/mixed-with-light-dom-slots-inside/index.js',
     'scoped-slots/mixed-with-light-dom-slots-outside/index.js',
     'slot-forwarding/scoped-slots/index.js',
-    'slot-not-at-top-level/advanced/ifTrue/light/index.js',
     'slot-not-at-top-level/advanced/ifTrue/shadow/index.js',
     'slot-not-at-top-level/advanced/lwcIf/light/index.js',
     'slot-not-at-top-level/advanced/lwcIf/shadow/index.js',

packages/@lwc/ssr-compiler/src/compile-template/transformers/for-each.ts

@@ -7,7 +7,7 @@
 
 import { builders as b, is } from 'estree-toolkit';
 import { esTemplate } from '../../estemplate';
-import { irToEs } from '../ir-to-es';
+import { irChildrenToEs } from '../ir-to-es';
 import { getScopedExpression, optimizeAdjacentYieldStmts } from '../shared';
 
 import type { ForEach as IrForEach } from '@lwc/template-compiler';
@@ -25,9 +25,7 @@ export const ForEach: Transformer<IrForEach> = function ForEach(node, cxt): EsFo
     const forIndexId = node.index?.name ?? '__unused__';
 
     cxt.pushLocalVars([forItemId, forIndexId]);
-    const forEachStatements = node.children.flatMap((childNode) => {
-        return irToEs(childNode, cxt);
-    });
+    const forEachStatements = irChildrenToEs(node.children, cxt);
     cxt.popLocalVars();
 
     const expression = node.expression as EsExpression;

packages/@lwc/ssr-compiler/src/compile-template/transformers/for-of.ts

@@ -7,7 +7,7 @@
 
 import { builders as b, is } from 'estree-toolkit';
 import { esTemplate } from '../../estemplate';
-import { irToEs } from '../ir-to-es';
+import { irChildrenToEs } from '../ir-to-es';
 import { optimizeAdjacentYieldStmts } from '../shared';
 
 import type { ForOf as IrForOf } from '@lwc/template-compiler';
@@ -37,9 +37,7 @@ const bForOfYieldFrom = esTemplate`
 export const ForOf: Transformer<IrForOf> = function ForEach(node, cxt): EsForOfStatement[] {
     const id = node.iterator.name;
     cxt.pushLocalVars([id]);
-    const forEachStatements = node.children.flatMap((childNode) => {
-        return irToEs(childNode, cxt);
-    });
+    const forEachStatements = irChildrenToEs(node.children, cxt);
     cxt.popLocalVars();
 
     const expression = node.expression as EsExpression;

packages/@lwc/ssr-compiler/src/compile-template/transformers/if.ts

@@ -6,7 +6,7 @@
  */
 
 import { builders as b } from 'estree-toolkit';
-import { irToEs } from '../ir-to-es';
+import { irChildrenToEs } from '../ir-to-es';
 import { expressionIrToEs } from '../expression';
 import { optimizeAdjacentYieldStmts } from '../shared';
 
@@ -28,7 +28,7 @@ function bBlockStatement(
     cxt: TransformerContext,
     insertComments: boolean
 ): EsBlockStatement {
-    let statements = childNodes.flatMap((childNode) => irToEs(childNode, cxt));
+    let statements = irChildrenToEs(childNodes, cxt);
     if (insertComments) statements = [bYieldComment(), ...statements, bYieldComment()];
     return b.blockStatement(optimizeAdjacentYieldStmts(statements));
 }