remarkjs / react-markdown

Markdown component for React
https://remarkjs.github.io/react-markdown/
MIT License
12.48k stars 849 forks source link

Possible inconsistency with handling emphasis and strong when immediately followed by emphasis #812

Closed puopg closed 4 months ago

puopg commented 4 months ago

When processing the MD string

***123****456*

<em>
  <strong>123</strong>
</em>
<em>456</em>

React markdown renders what seems to be some additional asterisks?

Screenshot 2024-01-31 at 1 15 46 PM

Initial checklist

Affected packages and versions

9.0.1

Link to runnable example

No response

Steps to reproduce

Compare the result of:

This is just 1 word, where the first half is both italicized and bolded, the 2nd half is only italicized.

The MDAST that gets created from unified() => rehypeParse => rehypeRemark looks correct, so to me the issue seems to be either:

  1. The syntax generated from the processing flow is incorrect.
  2. The syntax is correct, and its React-Markdown's rendering of the syntax that is not correct.

Expected behavior

Screenshot 2024-01-31 at 1 15 38 PM

Actual behavior

Screenshot 2024-01-31 at 1 15 46 PM

Runtime

No response

Package manager

No response

OS

No response

Build and bundle tools

No response

ChristianMurphy commented 4 months ago

Thanks @puopg!

Tracing this further into the stack. This is coming from the markdown parser react-markdown uses, micromark https://stackblitz.com/edit/stackblitz-starters-n2yquc

I know there is at least one emphasis related issue open https://github.com/micromark/micromark/issues/92 But this feels different, would you be interested/able to post an issue to micromark @puopg?

puopg commented 4 months ago

Sure thing, lemme open one and ill link it here.

https://github.com/micromark/micromark/issues/162

wooorm commented 4 months ago

Thanks, moving the discussion there :)