11ty / webc

Single File Web Components
MIT License
1.3k stars 36 forks source link

Markdown Blockquote Syntax Does Not Render in WebC #193

Closed spaceninja closed 9 months ago

spaceninja commented 9 months ago

I've added a webc component and it's mostly working, but confusingly it's only rendering some of the markdown formatting in the slot.

In my eleventy config, I've set markdownTemplateEngine: 'webc'

media-object.webc

<div class="media-object">
  <div class="media-object__media">
    <slot name="media">
  </div>
  <div class="media-object__content">
    <slot></slot>
  </div>
</div>

blog-post.md

Intro text

<media-object>

<img slot="media" webc:is="eleventy-image" :src="example.jpg" alt="">

## Lorem Ipsum

> Dolor sit amet, **consectetur** adipiscing elit.

Dolor sit amet, **consectetur** adipiscing elit.

</media-object>

Outro text

What actually gets rendered is

<p>Intro text</p>
<div class="media-object">
  <div class="media-object__media">
    <img ... >
  </div>
  <div class="media-object__content">
    <h2>Lorem Ipsum</h2>
    <p>> Dolor sit amet, <strong>consectetur</strong> adipiscing elit.</p>
    <p>Dolor sit amet, <strong>consectetur</strong> adipiscing elit.</p>
  </div>
</div>
<p>Outro text</p>

Note the blockquote didn't get rendered (but the strong tag inside did!)

spaceninja commented 9 months ago

Okay, I just noticed it's not limited to my component. Any blog post with blockquote formatting has the same effect.

So, setting webc as the template engine for markdown files somehow results in some markdown rendering (headings, bolds, italics, paragraphs, etc), but not blockquotes.

Test case:

# Title

> Dolor sit amet, **consectetur** adipiscing elit.

Dolor sit amet, **consectetur** adipiscing elit.

Renders as

<h1>Title</h1>
<p>> Dolor sit amet, <strong>consectetur</strong> adipiscing elit.</p>
<p>Dolor sit amet, <strong>consectetur</strong> adipiscing elit.</p>
spaceninja commented 9 months ago

And now that I had a better set of search terms, I find this is already a reported issue.

I really wish that the documentation page mentioned that this was a bad idea, it could have saved me a couple days of wasted work.

https://github.com/11ty/eleventy-plugin-webc/issues/34