diff options
| -rw-r--r-- | .changeset/gentle-parrots-cheer.md | 5 | ||||
| -rw-r--r-- | packages/integrations/mdx/src/index.ts | 1 | ||||
| -rw-r--r-- | packages/integrations/mdx/test/mdx-plugins.test.js | 2 |
3 files changed, 7 insertions, 1 deletions
diff --git a/.changeset/gentle-parrots-cheer.md b/.changeset/gentle-parrots-cheer.md new file mode 100644 index 000000000..749dc8fb1 --- /dev/null +++ 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 index 577d073ee..7012849a4 100644 --- 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 index a3a871762..139d2042f 100644 --- 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({ |