Support rehype plugins that inject namespaced attributes 2

withastro · Feb 15, 2023 · a78b74a · a78b74a
1 parent 66acc6a
commit a78b74a
Show file tree

Hide file tree

Showing 3 changed files with 7 additions and 1 deletion.
diff --git a/.changeset/gentle-parrots-cheer.md b/.changeset/gentle-parrots-cheer.md
@@ -0,0 +1,5 @@
+---
+'@astrojs/mdx': minor
+---
+
+Support rehype plugins that inject namespaced attributes. This introduces a breaking change if you use [custom components for HTML elements](https://docs.astro.build/en/guides/markdown-content/#assigning-custom-components-to-html-elements), where the prop passed to the component will be normal HTML casing, e.g. `class` instead of `className`, and `xlink:href` instead of `xlinkHref`.
diff --git a/packages/integrations/mdx/src/index.ts b/packages/integrations/mdx/src/index.ts
@@ -74,6 +74,7 @@ export default function mdx(partialMdxOptions: Partial<MdxOptions> = {}): AstroI
 									const { data: frontmatter, content: pageContent } = parseFrontmatter(code, id);
 									const compiled = await mdxCompile(new VFile({ value: pageContent, path: id }), {
 										...mdxPluginOpts,
+										elementAttributeNameCase: 'html',
 										remarkPlugins: [
 											// Ensure `data.astro` is available to all remark plugins
 											toRemarkInitializeAstroData({ userFrontmatter: frontmatter }),

diff --git a/packages/integrations/mdx/test/mdx-plugins.test.js b/packages/integrations/mdx/test/mdx-plugins.test.js
@@ -63,7 +63,7 @@ describe('MDX plugins', () => {
 		expect(selectRehypeExample(document)).to.not.be.null;
 	});
 
-	it.skip('supports custom rehype plugins with namespaced attributes', async () => {
+	it('supports custom rehype plugins with namespaced attributes', async () => {
 		const fixture = await buildFixture({
 			integrations: [
 				mdx({