fix(compiler): allow comments between switch cases (#52449)

Fixes that the template parser was throwing an error if a comment is used directly inside an `@switch` block. Fixes #52421. PR Close #52449
angular · Oct 31, 2023 · 2aaddd3 · 2aaddd3
1 parent 6c58252
commit 2aaddd3
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 2 deletions.
diff --git a/packages/compiler/src/render3/r3_control_flow.ts b/packages/compiler/src/render3/r3_control_flow.ts
@@ -338,8 +338,10 @@ function validateSwitchBlock(ast: html.Block): ParseError[] {
   }
 
   for (const node of ast.children) {
-    // Skip over empty text nodes inside the switch block since they can be used for formatting.
-    if (node instanceof html.Text && node.value.trim().length === 0) {
+    // Skip over comments and empty text nodes inside the switch block.
+    // Empty text nodes can be used for formatting while comments don't affect the runtime.
+    if (node instanceof html.Comment ||
+        (node instanceof html.Text && node.value.trim().length === 0)) {
       continue;
     }
 

diff --git a/packages/compiler/test/render3/r3_template_transform_spec.ts b/packages/compiler/test/render3/r3_template_transform_spec.ts
@@ -1364,6 +1364,24 @@ describe('R3 template transform', () => {
       ]);
     });
 
+    it('should parse a switch block containing comments', () => {
+      expectFromHtml(`
+          @switch (cond.kind) {
+            <!-- X case -->
+            @case (x) { X case }
+
+            <!-- default case -->
+            @default { No case matched }
+          }
+        `).toEqual([
+        ['SwitchBlock', 'cond.kind'],
+        ['SwitchBlockCase', 'x'],
+        ['Text', ' X case '],
+        ['SwitchBlockCase', null],
+        ['Text', ' No case matched '],
+      ]);
+    });
+
     describe('validations', () => {
       it('should report syntax error in switch expression', () => {
         expect(() => parse(`