diff options
| -rw-r--r-- | .changeset/gold-carrots-bow.md | 5 | ||||
| -rw-r--r-- | packages/astro/src/compiler/codegen/index.ts | 21 | ||||
| -rw-r--r-- | packages/astro/test/astro-markdown.test.js | 14 | ||||
| -rw-r--r-- | packages/astro/test/fixtures/astro-markdown/src/pages/recursive.astro | 15 |
4 files changed, 48 insertions, 7 deletions
diff --git a/.changeset/gold-carrots-bow.md b/.changeset/gold-carrots-bow.md new file mode 100644 index 000000000..62c60f640 --- /dev/null +++ b/.changeset/gold-carrots-bow.md @@ -0,0 +1,5 @@ +--- +'astro': patch +--- + +Fixed a bug where recursive markdown was not working properly diff --git a/packages/astro/src/compiler/codegen/index.ts b/packages/astro/src/compiler/codegen/index.ts index 8c5cb1fb1..a89033249 100644 --- a/packages/astro/src/compiler/codegen/index.ts +++ b/packages/astro/src/compiler/codegen/index.ts @@ -454,9 +454,7 @@ async function compileHtml(enterNode: TemplateNode, state: CodegenState, compile }); // 3. Codegen - // Reset state before compilation - state.markers.insideMarkdown = false; - const result = await compileHtml(ast.html, state, compileOptions); + const result = await compileHtml(ast.html, { ...state, markers: { insideMarkdown: false } }, compileOptions); buffers.out += ',' + result; buffers.markdown = ''; @@ -554,7 +552,7 @@ async function compileHtml(enterNode: TemplateNode, state: CodegenState, compile } if (componentName === 'Markdown') { const { $scope } = attributes ?? {}; - state.markers.insideMarkdown = { $scope }; + state.markers.insideMarkdown = typeof state.markers.insideMarkdown === 'object' ? { $scope, count: state.markers.insideMarkdown.count + 1 } : { $scope, count: 1 }; if (attributes.content) { if (curr === 'markdown') { await pushMarkdownToBuffer(); @@ -638,6 +636,9 @@ async function compileHtml(enterNode: TemplateNode, state: CodegenState, compile case 'Body': case 'Title': case 'Element': { + if (state.markers.insideMarkdown) { + await pushMarkdownToBuffer(); + } if (paren !== -1) { buffers.out += ')'; paren--; @@ -645,9 +646,17 @@ async function compileHtml(enterNode: TemplateNode, state: CodegenState, compile return; } case 'InlineComponent': { + if (node.name === 'Markdown') { + (state.markers.insideMarkdown as Record<string, any>).count--; + if ((state.markers.insideMarkdown as Record<string, any>).count <= 0) { + state.markers.insideMarkdown = false; + } + } if (curr === 'markdown' && buffers.markdown !== '') { await pushMarkdownToBuffer(); - return; + if (!state.markers.insideMarkdown) { + return; + } } if (paren !== -1) { buffers.out += ')'; @@ -664,7 +673,7 @@ async function compileHtml(enterNode: TemplateNode, state: CodegenState, compile } }, }).then(() => { - const content = buffers.out.replace(/^\,/, '').replace(/\,\)/g, ')').replace(/\,+/g, ',').replace(/\)h/g, '),h'); + const content = buffers.out.replace(/^\,/, '').replace(/\,\)/g, ')').replace(/\,+/g, ',').replace(/\)h/g, '),h') buffers.out = ''; buffers.markdown = ''; return resolve(content); diff --git a/packages/astro/test/astro-markdown.test.js b/packages/astro/test/astro-markdown.test.js index 5500736c9..31170d034 100644 --- a/packages/astro/test/astro-markdown.test.js +++ b/packages/astro/test/astro-markdown.test.js @@ -45,7 +45,7 @@ Markdown('Bundles client-side JS for prod', async (context) => { assert.ok(counterJs, 'Counter.jsx is bundled for prod'); }); -Markdown('Renders content correctly when deeply nested on a page', async ({ runtime }) => { +Markdown('Renders correctly when deeply nested on a page', async ({ runtime }) => { const result = await runtime.load('/deep'); if (result.error) throw new Error(result.error); @@ -60,6 +60,18 @@ Markdown('Renders content correctly when deeply nested on a page', async ({ runt assert.equal($('.c > h2').text(), 'C', 'Rendered title in correct section'); }); +Markdown('Renders recursively', async ({ runtime }) => { + const result = await runtime.load('/recursive'); + if (result.error) throw new Error(result.error); + + console.log(result.contents); + + const $ = doc(result.contents); + assert.equal($('.a > h1').text(), 'A', 'Rendered title .a correctly'); + assert.equal($('.b > h1').text(), 'B', 'Rendered title .b correctly'); + assert.equal($('.c > h1').text(), 'C', 'Rendered title .c correctly'); +}); + Markdown('Renders dynamic content though the content attribute', async ({ runtime }) => { const result = await runtime.load('/external'); if (result.error) throw new Error(result.error); diff --git a/packages/astro/test/fixtures/astro-markdown/src/pages/recursive.astro b/packages/astro/test/fixtures/astro-markdown/src/pages/recursive.astro new file mode 100644 index 000000000..d74a41535 --- /dev/null +++ b/packages/astro/test/fixtures/astro-markdown/src/pages/recursive.astro @@ -0,0 +1,15 @@ +--- +import { Markdown } from 'astro/components'; +--- + +<Markdown> + <div class="a"> + # A + <div class="b"> + # B + <div class="c"> + # C + </div> + </div> + </div> +</Markdown> |