react-md-editor Markdown crashes with specific HTML-like string input

Description

When providing the string <!DOCTYPE html><!-- <html>\n <head>\n as the source of the Markdown, the @uiw/react-md-editor crashes and throws an error: "Cannot read properties of null (reading 'data')".

Steps to Reproduce

Initialize @uiw/react-md-editor in a React component.
Set the Markdown content to <!DOCTYPE html><!-- <html>\n <head>\n.
Observe the crash and the error message.

Expected Behavior

The editor should handle the input gracefully without crashing.

Actual Behavior

The editor crashes and throws an error: "Cannot read properties of null (reading 'data')".

Additional Information

Version: 4.0.4
OS: macOS Sonoma 14.5
Browser: Chrome 126.0.6478.127

Relevant Code

import React, { useState } from 'react';
import MDEditor from '@uiw/react-md-editor';
import rehypeSanitize from 'rehype-sanitize';

const MarkdownEditorExample = () => {
  const [markdown, setMarkdown] = useState('<!DOCTYPE html><!-- <html>\n  <head>\n');

  return (
    <div>
      <MDEditor.Markdown source={markdown} rehypePlugins={[rehypeSanitize]} />
    </div>
  );
};

export default MarkdownEditorExample;

Aug 07 '24 09:08 ruben-hexens

@ruben-hexens You can make some settings to filter out certain tags.

https://github.com/uiwjs/react-md-editor/blob/2520e88123bde4f4d31415bb362183964f94ca48/www/src/Example.tsx#L37-L54

https://github.com/uiwjs/react-md-editor/issues/406#issuecomment-1154110255

Sep 04 '24 08:09 jaywcjlove

@jaywcjlove Thank you for your response. However, the issue isn’t just about filtering specific tags. The string I provided contains valid code, and even if you replace the <html> and <head> tags with other HTML tags, the editor still crashes.

It seems like the problem is related to how these tags are handled in the editor, rather than just filtering them out. Could you provide guidance on how to prevent the crash while allowing such valid input to be processed safely?

Oct 02 '24 14:10 ruben-hexens