mdx-editor / editor

A rich text editor React component for markdown
https://mdxeditor.dev
MIT License
1.87k stars 141 forks source link

[BUG] Implicit self closing HTML tags (e.g. <br>) are unsupported by the editor #472

Open mlequime opened 4 months ago

mlequime commented 4 months ago

Describe the bug Implicit self-closing HTML tags like <img> and <br> fail to load in the MDX editor as they 'have an unmatched closing tag'.

Reproduction Repro sandbox

To Reproduce Steps to reproduce the behavior:

  1. First editor fails to load

Expected behavior
renders as a linebreak as supported in most flavours of markdown

Screenshots If applicable, add screenshots to help explain your problem.

Desktop (please complete the following information):

Additional context HTML tags appear to be parsed with the JSX parser, which is expecting a self-closing tag marker or an end tag (to be valid JSX syntax)

petyosi commented 4 months ago

If you turn on suppressHtmlProcessing (thus, disabling the JSX parser), you're going to get those tags as HTML strings parse time; From there, you can write a visitor that handles them. However, this can get really messy for img tags due to attribute order, casing, quotes etc.

I do understand that this is good to be supported, but writing an HTML parser is very complicated. I would honestly instead consider some pre-processing and sanitization of the markdown instead.