fix: STRF-11523 Enable dynamic partials (#1248)

feat: STRF-11523 Enable dynamic partials
bigcommerce · Dec 18, 2024 · 4fab613 · 4fab613
1 parent 2604750
commit 4fab613
Show file tree

Hide file tree

Showing 3 changed files with 55 additions and 5 deletions.
diff --git a/lib/template-assembler.js b/lib/template-assembler.js
@@ -4,7 +4,7 @@ import fs from 'graceful-fs';
 import path from 'path';
 import upath from 'upath';
 
-const partialRegex = /\{\{>\s*([_|\-|a-zA-Z0-9@'"/]+)[^{]*?}}/g;
+const partialRegex = /\{\{#?>\s*([_|\-|a-zA-Z0-9@'"/]+)[^{]*?}}/g;
 const partialWithoutBracketsRegex = /[^>{{}}\s*]+/g;
 const dynamicComponentRegex = /\{\{\s*?dynamicComponent\s*(?:'|")([_|\-|a-zA-Z0-9/]+)(?:'|").*?}}/g;
 const includeRegex = /{{2}>\s*([_|\-|a-zA-Z0-9/]+)[^{]*?}{2}/g;

diff --git a/server/plugins/renderer/responses/pencil-response.spec.js b/server/plugins/renderer/responses/pencil-response.spec.js
@@ -1,9 +1,12 @@
 import { jest } from '@jest/globals';
+import path from 'path';
+import { promisify } from 'util';
 import PencilResponse from './pencil-response.js';
+import templateAssembler from '../../../../lib/template-assembler.js';
 
 describe('PencilResponse', () => {
     const assembler = {
-        getTemplates: (path) => new Promise((resolve) => resolve({ path })),
+        getTemplates: (p) => new Promise((resolve) => resolve({ path: p })),
         getTranslations: () => new Promise((resolve) => resolve([])),
     };
     let data;
@@ -13,7 +16,10 @@ describe('PencilResponse', () => {
     beforeEach(() => {
         data = {
             context: {
-                settings: {},
+                settings: {
+                    base_url: 'http://localhost:3000',
+                    secure_base_url: 'https://localhost:3000',
+                },
                 theme_settings: {},
                 template_engine: 'handlebars-v3',
             },
@@ -60,4 +66,49 @@ describe('PencilResponse', () => {
         await pencilResponse.respond(request, h);
         expect(h.response).toHaveBeenCalledTimes(1);
     });
+
+    describe('it should successfully render a tempalte with dynamic partials', () => {
+        it('should render a template with dynamic partials', async () => {
+            let result = '';
+            data.template_file = 'pages/page3';
+            data.context.template_engine = 'handlebars-v4';
+
+            h.response = (output) => {
+                result = output;
+                return response;
+            };
+            const themeAssembler = {
+                async getTemplates(templatesPath, processor) {
+                    const templates = await promisify(templateAssembler.assemble)(
+                        path.join(process.cwd(), 'test/_mocks/themes/valid', 'templates'),
+                        templatesPath,
+                    );
+                    return processor(templates);
+                },
+                getTranslations: async () => {
+                    return {};
+                },
+            };
+            const pencilResponse = new PencilResponse(data, themeAssembler);
+            await pencilResponse.respond(request, h);
+            expect(result.content).toEqual(`<!DOCTYPE html>
+<html>
+<head>
+    <title>page3.html</title>
+    
+</head>
+<body>
+    <h1></h1>
+    Here is the list:
+<ul>
+        <li>
+    <a href="item_link_1">Item 1</a>
+</li>    <li>
+    <a href="item_link_2">Item 2</a>
+</li>    <li>
+    <a href="item_link_3">Item 3</a>
+</li><ul></body>
+</html>`);
+        });
+    });
 });
diff --git a/.../themes/valid/templates/pages/page.3.html → ...s/themes/valid/templates/pages/page3.html b/.../themes/valid/templates/pages/page.3.html → ...s/themes/valid/templates/pages/page3.html
@@ -7,6 +7,5 @@
 <body>
     <h1>{{theme_settings.customizable_title}}</h1>
     {{> components/c }}
-    {{footer.scripts}}
 </body>
-</html>
+</html>