mdx-editor / editor

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

[BUG] Bold format did not get serialized with any punctuation character #484

Open felix98765 opened 1 month ago

felix98765 commented 1 month ago

Describe the bug Bold format serialized with any punctuation character cannot be rendered back.

Reproduction quotes: https://codesandbox.io/p/sandbox/mdx-editor-base-forked-yzft7z?file=%2Fsrc%2FApp.tsx

Exclamation mark: https://codesandbox.io/p/sandbox/mdx-editor-base-forked-69dgt8?file=%2Fsrc%2FApp.tsx

(Originally I though it was quotes only, but after posting this bug report I reproduced it with exclamation mark)

To Reproduce Steps to reproduce the behavior:

  1. Go to the codesandbox https://codesandbox.io/p/sandbox/mdx-editor-base-forked-yzft7z?file=%2Fsrc%2FApp.tsx
  2. In the first editor with markdown md1, select "b" and hit ctrl+b, it makes the "b" 3 chars bold.
  3. In the console it should shows content is now equal to md2 a**"b"**c.
  4. But in second editor with md2 as initial markdown, it renders nothing bold.

Expected behavior Ctrl+b should make the text bold even after serialized and deserialized back.

Screenshots

image

image

felix98765 commented 1 month ago

Tested with unicode quote, also cannot get serialized.

Repro: https://codesandbox.io/p/sandbox/mdx-editor-base-forked-jl66r3?file=%2Fsrc%2FApp.tsx%3A47%2C6

image
felix98765 commented 1 month ago

Actually bold format cannot get serialized with any prunctuation, doesn't matter it is quotes or not.

Repro: https://codesandbox.io/p/sandbox/mdx-editor-base-forked-69dgt8?file=%2Fsrc%2FApp.tsx

image
petyosi commented 1 month ago

I believe that this problem falls into the category of formatting that's possible to be done in the rich text environment, but impossible to be converted to a valid markdown. If you try writing the same markdown in StackEdit, you get the same problem.

Happy to accept a contribution that fixes it, but I am not aware of a way to address it.