feat: ignore nested abell blocks by default

abelljs · Oct 17, 2022 · 6ce17fa · 6ce17fa
1 parent f394049
commit 6ce17fa
Show file tree

Hide file tree

Showing 3 changed files with 39 additions and 1 deletion.
diff --git a/packages/abell/package.json b/packages/abell/package.json
@@ -1,6 +1,6 @@
 {
   "name": "abell",
-  "version": "1.0.0-alpha.71",
+  "version": "1.0.0-alpha.72",
   "description": "Abell is a static-site-generator for JavaScript developers. Powered by Vite, It tries to stay close to fundamentals while providing a great DX",
   "bin": "./dist/bin.js",
   "main": "./dist/index.js",

diff --git a/packages/abell/src/vite-plugin-abell/compiler/compiler.spec.ts b/packages/abell/src/vite-plugin-abell/compiler/compiler.spec.ts
@@ -64,6 +64,31 @@ describe('compile()', () => {
           </body>"
     `);
   });
+
+  test('should ignore the nested abell blocks', () => {
+    const abellCode = `
+    <body>
+      Evaulation Block: {{ 3 + 4 }}
+      Evaluation Block with Nesting: {{ 'start-{{ 2 + 1 }}-end' }}
+      Evaluation Block with Nesting: {{ 'start-{{ {{ 2 + 1 }} }}-end' }}
+      Escaped Block: \\{{ 2 + 1 }}
+    </body>
+    `;
+    const out = compile(abellCode, {
+      filepath: __dirname,
+      outputType: 'syntax-blocks'
+    });
+    expect(out.out.text).toMatchInlineSnapshot(`
+      "
+          <body>
+            Evaulation Block: \${e( 3 + 4 )}
+            Evaluation Block with Nesting: \${e( 'start-{{ 2 + 1 }}-end' )}
+            Evaluation Block with Nesting: \${e( 'start-{{ {{ 2 + 1 }} }}-end' )}
+            Escaped Block: \\\\{{ 2 + 1 }}
+          </body>
+          "
+    `);
+  });
 });
 
 describe('scoped css', () => {

diff --git a/packages/abell/src/vite-plugin-abell/compiler/syntax-blocks.ts b/packages/abell/src/vite-plugin-abell/compiler/syntax-blocks.ts
@@ -9,6 +9,7 @@ export const getSyntaxBlocks = (
 ): AbstractSyntaxArrayType => {
   const blockState = {
     isInsideAbellBlock: false,
+    abellNestedBlockLevelCount: 0,
     isInsideCSSBlock: false,
     blockCount: 0,
     cssAttributes: {} as Record<string, string | boolean>
@@ -39,6 +40,12 @@ export const getSyntaxBlocks = (
        *
        * Token: `{{`
        */
+      if (blockState.isInsideAbellBlock) {
+        // We're already inside abell block so this is a nested block.
+        texts.abellText += token.text;
+        blockState.abellNestedBlockLevelCount++;
+        continue;
+      }
       blockState.isInsideAbellBlock = true;
       blockState.blockCount++;
     } else if (token.type === 'BLOCK_END') {
@@ -48,6 +55,12 @@ export const getSyntaxBlocks = (
        * Token: `}}`
        */
 
+      if (blockState.abellNestedBlockLevelCount > 0) {
+        texts.abellText += token.text;
+        blockState.abellNestedBlockLevelCount--;
+        continue;
+      }
+
       if (!blockState.isInsideAbellBlock) {
         addToHTML(token.text);
         continue;