inline html transform error

[yonecdeng]

Describe the bug

The original md document：

   hello <picture>
     <img src="https://github.com/markdown-it/markdown-it/assets/73653404/63aa836d-2541-40bb-a4be-aaf02495426d"/>
   </picture>

After executing md.render it will be：

   <p>hello <picture></p>
     <img src="https://github.com/markdown-it/markdown-it/assets/73653404/63aa836d-2541-40bb-a4be-aaf02495426d"/>
   </picture>

Reproduction

you can try this markdown content:

   hello <picture>
     <img src="https://github.com/markdown-it/markdown-it/assets/73653404/63aa836d-2541-40bb-a4be-aaf02495426d"/>
   </picture>

Expected behavior

I hope after executing md.render it should be：

   <p>hello</p><picture>
     <img src="https://github.com/markdown-it/markdown-it/assets/73653404/63aa836d-2541-40bb-a4be-aaf02495426d"/>
   </picture>

System Info

Additional context

This seems to be caused by using some mdit plugin, because I tried it here and it converted correctly

Validations

• [X] Check if you're on the latest VitePress version.
• [X] Follow our Code of Conduct
• [X] Read the docs.
• [X] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.

[brc-dd]

Not reproducible - https://stackblitz.com/edit/vite-f3sd6k?file=docs%2Findex.md

\ PS: It should be rendered to this:

<p>hello <picture>
<img src="https://github.com/markdown-it/markdown-it/assets/73653404/63aa836d-2541-40bb-a4be-aaf02495426d"/>
</picture></p>

[brc-dd]

With your markdown-it playground example it's reproducible if you remove extra spaces from front. But there too it's producing invalid html. In that case the error is correct.

<p>hello <picture></p>
  <source type="image/avif" srcset="https://picbed-1306720359.cos.ap-guangzhou.myqcloud.com/upic/2024-02-07-17-37-OUE54Z.webp?imageMogr2/format/avif"/>
  <img src="https://picbed-1306720359.cos.ap-guangzhou.myqcloud.com/upic/2024-02-07-17-37-OUE54Z.webp" alt="https://picbed-1306720359.cos.ap-guangzhou.myqcloud.com/upic/2024-02-07-17-37-OUE54Z.webp" loading="lazy"/>
</picture>

If you don't remove spaces, then it works fine in both markdown-it playground and vitepress:

[yonecdeng]

With your markdown-it playground example it's reproducible if you remove extra spaces from front. But there too it's producing invalid html. In that case the error is correct.

<p>hello <picture></p>
  <source type="image/avif" srcset="https://picbed-1306720359.cos.ap-guangzhou.myqcloud.com/upic/2024-02-07-17-37-OUE54Z.webp?imageMogr2/format/avif"/>
  <img src="https://picbed-1306720359.cos.ap-guangzhou.myqcloud.com/upic/2024-02-07-17-37-OUE54Z.webp" alt="https://picbed-1306720359.cos.ap-guangzhou.myqcloud.com/upic/2024-02-07-17-37-OUE54Z.webp" loading="lazy"/>
</picture>

If you don't remove spaces, then it works fine in both markdown-it playground and vitepress:

thanks for your reply. i do not understand why the error is correct.

[brc-dd]

I do not understand why the error is correct.

Notice the first line <p>hello <picture></p> -- There is no closing tag for picture. (In other words, paragraph is closed before picture is closed.)

[yonecdeng]

I do not understand why the error is correct.

Notice the first line <p>hello <picture></p> -- There is no closing tag for picture. (In other words, paragraph is closed before picture is closed.)

Haha I know. I probably didn't make my point clear, I was trying to say that converting into this <p>hello <picture></p> shouldn't be right and why would it be converted to <p>hello <picture></p>?

[brc-dd]

I'm not fully sure about that. But that's according to the CommonMark standard. We cannot adjust that here.