sjwall / mdx-mermaid

Plug and play Mermaid in MDX
MIT License
161 stars 29 forks source link

TypeError: Cannot read properties of undefined (reading 'children') #91

Closed johackim closed 1 year ago

johackim commented 1 year ago

Hello @sjwall 😉

Describe the bug

Since yesterday, I have this error:

file:///home/johackim/Dev/test/node_modules/mdx-mermaid/lib/mdxast-mermaid.mjs:94
    return tree.children[0].children;
                            ^

TypeError: Cannot read properties of undefined (reading 'children')
    at outputSVG (file:///home/johackim/Dev/test/node_modules/mdx-mermaid/lib/mdxast-mermaid.mjs:94:29)
    at async transformer (file:///home/johackim/Dev/test/node_modules/mdx-mermaid/lib/mdxast-mermaid.mjs:122:32)

Node.js v18.16.0

To Reproduce

Steps to reproduce the behaviour including how the markdown file is processed:

// test.mjs

import * as runtime from 'react/jsx-runtime';
import { runSync, compile } from '@mdx-js/mdx';
import { renderToStaticMarkup } from 'react-dom/server';

const markdown = `
## Hello world

\`\`\`mermaid
graph LR;
    Acquisition-->Activation-->Rétention-->Recommandation-->Revenu
\`\`\`
`;

const code = String(await compile(markdown, {
    outputFormat: 'function-body',
    remarkPlugins: [
        [(await import('mdx-mermaid')).default, { output: 'svg' }],
    ],
}));

const { default: Content } = runSync(code, runtime);
const html = renderToStaticMarkup(Content());

console.log(html);

Additional context

Here my package.json :

{
  "devDependencies": {
    "@mdx-js/mdx": "2.1.0",
    "mdx-mermaid": "^2.0.0-rc7",
    "react": "^18.2.0",
    "react-dom": "^18.2.0"
  }
}
johackim commented 1 year ago

I confirm the fix #90 from @paul-sachs solves the bug.