Fix: markdown JSX expression inconsistencies (#3152)

* fix: remove micromark-extension-mdx-expression to unbreak JSX expressions

* chore: changeset

* deps: update lockfile

* tests: jsx expressions in markdown

.changeset/purple-timers-speak.md

@@ -0,0 +1,6 @@
+---
+'astro': patch
+'@astrojs/markdown-remark': patch
+---
+
+Fix JSX expression inconsistencies within markdown files

packages/astro/test/astro-markdown.test.js

@@ -23,6 +23,17 @@ describe('Astro Markdown', () => {
 		expect($('#test').length).to.be.ok;
 	});
 
+	it('Can parse JSX expressions in markdown pages', async () => {
+		const html = await fixture.readFile('/jsx-expressions/index.html');
+		const $ = cheerio.load(html);
+
+		expect($('h2').html()).to.equal('Blog Post with JSX expressions')
+		expect($('p').first().html()).to.equal('JSX at the start of the line!')
+		for (let listItem of ['test-1', 'test-2', 'test-3']) {
+			expect($(`#${listItem}`).html()).to.equal(`\n${listItem}\n`)
+		}
+	})
+
 	it('Can load more complex jsxy stuff', async () => {
 		const html = await fixture.readFile('/complex/index.html');
 		const $ = cheerio.load(html);

packages/astro/test/fixtures/astro-markdown/src/pages/jsx-expressions.md

@@ -0,0 +1,11 @@
+---
+title: Blog Post with JSX expressions
+paragraph: JSX at the start of the line!
+list: ['test-1', 'test-2', 'test-3']
+---
+
+## {frontmatter.title}
+
+{frontmatter.paragraph}
+
+{frontmatter.list.map(item => <p id={item}>{item}</p>)}

packages/markdown/remark/package.json

@@ -29,7 +29,6 @@
     "mdast-util-mdx-expression": "^1.2.0",
     "mdast-util-mdx-jsx": "^1.2.0",
     "mdast-util-to-string": "^3.1.0",
-    "micromark-extension-mdx-expression": "^1.0.3",
     "micromark-extension-mdx-jsx": "^1.0.3",
     "prismjs": "^1.27.0",
     "rehype-raw": "^6.1.1",

packages/markdown/remark/src/remark-expressions.ts

@@ -1,5 +1,4 @@
 // Vite bug: dynamically import() modules needed for CJS. Cache in memory to keep side effects
-let mdxExpression: any;
 let mdxExpressionFromMarkdown: any;
 let mdxExpressionToMarkdown: any;
 
@@ -7,7 +6,6 @@ export function remarkExpressions(this: any, options: any) {
 	let settings = options || {};
 	let data = this.data();
 
-	add('micromarkExtensions', mdxExpression({}));
 	add('fromMarkdownExtensions', mdxExpressionFromMarkdown);
 	add('toMarkdownExtensions', mdxExpressionToMarkdown);
 
@@ -19,10 +17,6 @@ export function remarkExpressions(this: any, options: any) {
 }
 
 export async function loadRemarkExpressions() {
-	if (!mdxExpression) {
-		const micromarkMdxExpression = await import('micromark-extension-mdx-expression');
-		mdxExpression = micromarkMdxExpression.mdxExpression;
-	}
 	if (!mdxExpressionFromMarkdown || !mdxExpressionToMarkdown) {
 		const mdastUtilMdxExpression = await import('mdast-util-mdx-expression');
 		mdxExpressionFromMarkdown = mdastUtilMdxExpression.mdxExpressionFromMarkdown;

pnpm-lock.yaml

@@ -1444,7 +1444,6 @@ importers:
       mdast-util-mdx-expression: ^1.2.0
       mdast-util-mdx-jsx: ^1.2.0
       mdast-util-to-string: ^3.1.0
-      micromark-extension-mdx-expression: ^1.0.3
       micromark-extension-mdx-jsx: ^1.0.3
       prismjs: ^1.27.0
       rehype-raw: ^6.1.1
@@ -1465,7 +1464,6 @@ importers:
       mdast-util-mdx-expression: 1.2.0
       mdast-util-mdx-jsx: 1.2.0
       mdast-util-to-string: 3.1.0
-      micromark-extension-mdx-expression: 1.0.3
       micromark-extension-mdx-jsx: 1.0.3
       prismjs: 1.27.0
       rehype-raw: 6.1.1
@@ -7689,18 +7687,6 @@ packages:
       micromark-util-types: 1.0.2
     dev: false
 
-  /micromark-extension-mdx-expression/1.0.3:
-    resolution: {integrity: sha512-TjYtjEMszWze51NJCZmhv7MEBcgYRgb3tJeMAJ+HQCAaZHHRBaDCccqQzGizR/H4ODefP44wRTgOn2vE5I6nZA==}
-    dependencies:
-      micromark-factory-mdx-expression: 1.0.6
-      micromark-factory-space: 1.0.0
-      micromark-util-character: 1.1.0
-      micromark-util-events-to-acorn: 1.0.4
-      micromark-util-symbol: 1.0.1
-      micromark-util-types: 1.0.2
-      uvu: 0.5.3
-    dev: false
-
   /micromark-extension-mdx-jsx/1.0.3:
     resolution: {integrity: sha512-VfA369RdqUISF0qGgv2FfV7gGjHDfn9+Qfiv5hEwpyr1xscRj/CiVRkU7rywGFCO7JwJ5L0e7CJz60lY52+qOA==}
     dependencies: