Merge pull request #8 from ember-tooling/handle-yield-blocks

Handle yield blocks properly

Author: evoactivity

src/babel/rewriteHbs.ts

@@ -1,10 +1,16 @@
 import recast, { type AST } from 'ember-template-recast';
 import fs from 'node:fs';
-import { fixFilename } from './utils.ts';
+import { fixFilename, combineRegexPatterns } from './utils.ts';
 import { Transformer } from 'content-tag-utils';
 
 let fileCache = new Map<string, string>();
 
+const invalidTagPatterns = [
+  /^:/, // Don't process named blocks (:block-name)
+];
+
+const isInvalidTag = combineRegexPatterns(invalidTagPatterns);
+
 function getFullFileContent(filename: string): string {
   if (fileCache.has(filename)) {
     return fileCache.get(filename)!;
@@ -75,6 +81,10 @@ export function templatePlugin(env: { filename: string }) {
         return;
       }
 
+      if (isInvalidTag(node.tag)) {
+        return;
+      }
+
       const innerCoordinates = {
         line: node.loc.startPosition.line,
         column: node.loc.startPosition.column,

src/babel/utils.ts

@@ -165,3 +165,38 @@ export function fixFilename(filename: string): string {
 
   return fileName.replace(workspace, '');
 }
+
+/**
+ * Combines multiple regex patterns into a single regex that tests if ANY of them match.
+ * Uses the OR operator (|) to join patterns.
+ *
+ * @param patterns - Array of RegExp objects to combine
+ * @returns A function that tests if the input string matches any of the patterns
+ *
+ * @example
+ * const isValid = combineRegexPatterns([
+ *   /^[a-zA-Z]/, // starts with letter
+ *   /^@/,        // starts with @
+ * ]);
+ * isValid('Hello') // true
+ * isValid('@component') // true
+ * isValid('123') // false
+ */
+export function combineRegexPatterns(
+  patterns: RegExp[],
+): (input: string) => boolean {
+  if (patterns.length === 0) {
+    return () => false;
+  }
+
+  if (patterns.length === 1) {
+    return (input: string) => patterns[0]!.test(input);
+  }
+
+  // Extract source patterns and combine with OR
+  const combinedPattern = patterns.map((regex) => regex.source).join('|');
+
+  const combinedRegex = new RegExp(combinedPattern);
+
+  return (input: string) => combinedRegex.test(input);
+}

tests/fixtures/yield-blocks.gjs

@@ -0,0 +1,6 @@
+<template>
+  <Thing>
+    <:block1>
+    </:block1>
+  </Thing>
+</template>

tests/template-plugin.test.ts

@@ -181,6 +181,21 @@ describe('Adds data attributes to tags', () => {
 
     expect(templateContentsOf(output)).toMatchSnapshot();
   });
+
+  it('handles yield blocks', async () => {
+    const output = await transform('./fixtures/yield-blocks.gjs', {
+      additionalRoots: ['tests/fixtures'],
+    });
+
+    expect(templateContentsOf(output)).toMatchInlineSnapshot(`
+      [
+        "<Thing data-source-file="/tests/fixtures/yield-blocks.gjs" data-source-line="2" data-source-column="3">
+        <:block1>
+        </:block1>
+      </Thing>",
+      ]
+    `);
+  });
 });
 
 describe('removes SourceLens component and import in production', () => {