webc
webc copied to clipboard
Nested slots not possible? causes compilation to hang
Hi - I have come across an error (possible bug?) trying to pass through content using nested slots. (but perhaps this is also just usage that is not really indended)
my-paragraph.webc:
<p>
<slot></slot>
</p>
paragraph-with-wrapper.webc:
<div class="with-wrapper">
<my-paragraph>
<slot></slot>
</my-paragraph>`
</div>
within my index.webc
<my-paragraph>hello I am a mere paragraph</my-paragraph>
<paragraph-with-wrapper>
I am a paragraph wrapped in some other stuff
</paragraph-with-wrapper>
expected output:
<p>hello I am a mere paragraph</p>
<div class="with-wrapper">
<p>I am a paragraph wrapped in some other stuff</p>
</div>
build/compilation fails with a JavaScript heap out of memory error. am using the 2.x beta with webc 0.8.1
"@11ty/eleventy": "^2.0.0-beta.3",
"@11ty/eleventy-plugin-webc": "^0.8.1"
At the moment the workaround for this is to just do this instead
<div class="with-wrapper">
<slot></slot>
</div>
and then when you're consuming it
<paragraph-with-wrapper>
<my-paragraph>I am a paragraph wrapped in some other stuff</my-paragraph>
</paragraph-with-wrapper>
but it would be nice to be able to wrap things in other things (as you can do in svelte)
in v0.90 you can do the following to pass dynamic props down levels which is awesome! But I still can't figure out how to do the same for slot content. (maybe also I'm just not that smart 😅)
page.webc
<component-with-wrapper @heading="glorious!">
Hello there!
</component-with-wrapper>
component-with-wrapper.webc
<div class="wrapper-that-adds-some-specialness">
<component :@heading="heading">
I am a paragraph wrapped in some other stuff
<!-- BUT: dont know how to make
this part dynamic this.slots.text.default or `<slot></slot>` references itself
and runs into a loop -->
</component>
</div>
component.webc
<h2 @text="heading"></h2>
<slot></slot>
referencing this here as it may help others try and understand what I'm on about https://github.com/sveltejs/svelte/issues/790
also having a crack at this myself to see how far I can get.
Can confirm -- this seems to be a bug
I'm pretty new to WebC but can confirm this is still an issue. Took me quite a while to figure out what I had done which had caused the issue giving the non-descriptive errors ("JavaScript heap out of memory"). Even if this bug could be aknowledged by a maintiner that would help.
Is this something that will never be supported?
I've been messing around with this for a little bit off and on. And I have something that will stop the heap error from occurring, which I guess fixes the bug. Can possibly put up a PR for that with a more coherent error message. I do feel like Zach might have a few tricks up his sleeve though so not sure how much effort to put in at this stage as all of this will be migrated to ESM to support the new version of Eleventy.