diff options
-rw-r--r-- | .changeset/wild-phones-work.md | 6 | ||||
-rw-r--r-- | packages/astro/test/astro-markdown.test.js | 16 | ||||
-rw-r--r-- | packages/markdown/remark/src/rehype-collect-headers.ts | 2 | ||||
-rw-r--r-- | packages/markdown/remark/src/rehype-jsx.ts | 4 | ||||
-rw-r--r-- | packages/markdown/remark/test/components.test.js | 6 | ||||
-rw-r--r-- | packages/markdown/remark/test/expressions.test.js | 2 |
6 files changed, 23 insertions, 13 deletions
diff --git a/.changeset/wild-phones-work.md b/.changeset/wild-phones-work.md new file mode 100644 index 000000000..a55eecadf --- /dev/null +++ b/.changeset/wild-phones-work.md @@ -0,0 +1,6 @@ +--- +'astro': patch +'@astrojs/markdown-remark': patch +--- + +Remove extra newlines around Markdown components diff --git a/packages/astro/test/astro-markdown.test.js b/packages/astro/test/astro-markdown.test.js index 1ef8a4b9a..dd40bc071 100644 --- a/packages/astro/test/astro-markdown.test.js +++ b/packages/astro/test/astro-markdown.test.js @@ -291,12 +291,16 @@ describe('Astro Markdown', () => { expect(slots.find('> .fragmentSlot > div').text()).to.contain('1:'); expect(slots.find('> .fragmentSlot > div + p').text()).to.contain('2:'); expect(slots.find('> .pSlot > p[title="hello"]').text()).to.contain('3:'); - expect(slots.find('> .defaultSlot').text().replace(/\s+/g, ' ')).to.equal( - ` - 4: Div in default slot - 5: Paragraph in fragment in default slot - 6: Regular text in default slot - `.replace(/\s+/g, ' ') + expect(slots.find('> .defaultSlot').html()).to.match( + new RegExp( + `<div>4: Div in default slot</div>` + + // Optional extra paragraph due to the line breaks between components + `(<p></p>)?` + + `<p>5: Paragraph in fragment in default slot</p>` + + // Optional whitespace due to the line breaks between components + `[\s\n]*` + + `6: Regular text in default slot` + ) ); const nestedSlots = $('article').eq(1); diff --git a/packages/markdown/remark/src/rehype-collect-headers.ts b/packages/markdown/remark/src/rehype-collect-headers.ts index 9a64d59c8..76cb5740c 100644 --- a/packages/markdown/remark/src/rehype-collect-headers.ts +++ b/packages/markdown/remark/src/rehype-collect-headers.ts @@ -25,7 +25,7 @@ export default function createCollectHeaders() { return; } if (child.type === 'raw') { - if (child.value.startsWith('\n<') || child.value.endsWith('>\n')) { + if (child.value.match(/^\n?<.*>\n?$/)) { return; } } diff --git a/packages/markdown/remark/src/rehype-jsx.ts b/packages/markdown/remark/src/rehype-jsx.ts index a6761124c..7082997e2 100644 --- a/packages/markdown/remark/src/rehype-jsx.ts +++ b/packages/markdown/remark/src/rehype-jsx.ts @@ -53,11 +53,11 @@ export default function rehypeJsx(): ReturnType<RehypePlugin> { // wrapped by raw opening and closing tags const openingTag = { type: 'raw', - value: `\n<${node.name}${attrs}>`, + value: `<${node.name}${attrs}>`, }; const closingTag = { type: 'raw', - value: `</${node.name}>\n`, + value: `</${node.name}>`, }; parent.children.splice(index, 1, openingTag, ...node.children, closingTag); }); diff --git a/packages/markdown/remark/test/components.test.js b/packages/markdown/remark/test/components.test.js index ca0a3fdb4..4e06d7301 100644 --- a/packages/markdown/remark/test/components.test.js +++ b/packages/markdown/remark/test/components.test.js @@ -49,7 +49,7 @@ describe('components', () => { it('should normalize children', async () => { const { code } = await renderMarkdown(`<Component bool={true}>Hello world!</Component>`, {}); - chai.expect(code).to.equal(`\n<Component bool={true}>Hello world!</Component>\n`); + chai.expect(code).to.equal(`<Component bool={true}>Hello world!</Component>`); }); it('should be able to nest components', async () => { @@ -60,7 +60,7 @@ describe('components', () => { chai .expect(code) - .to.equal(`\n<Component bool={true}>\n<Component>Hello world!</Component>\n</Component>\n`); + .to.equal(`<Component bool={true}><Component>Hello world!</Component></Component>`); }); it('should allow markdown without many spaces', async () => { @@ -71,6 +71,6 @@ describe('components', () => { {} ); - chai.expect(code).to.equal(`\n<Component><h1 id="hello-world">Hello world!</h1></Component>\n`); + chai.expect(code).to.equal(`<Component><h1 id="hello-world">Hello world!</h1></Component>`); }); }); diff --git a/packages/markdown/remark/test/expressions.test.js b/packages/markdown/remark/test/expressions.test.js index ba28d9c8e..2963ff7f1 100644 --- a/packages/markdown/remark/test/expressions.test.js +++ b/packages/markdown/remark/test/expressions.test.js @@ -11,7 +11,7 @@ describe('expressions', () => { it('should be able to serialize expression inside component', async () => { const { code } = await renderMarkdown(`<Component>{a}</Component>`, {}); - chai.expect(code).to.equal(`\n<Component>{a}</Component>\n`); + chai.expect(code).to.equal(`<Component>{a}</Component>`); }); it('should be able to serialize expression inside markdown', async () => { |