Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Render plugin breaks webc:setup function #3641

Open
VAggrippino opened this issue Jan 30, 2025 · 0 comments
Open

Render plugin breaks webc:setup function #3641

VAggrippino opened this issue Jan 30, 2025 · 0 comments

Comments

@VAggrippino
Copy link

Operating system

Ubuntu 22.04

Eleventy

2.0.1

Describe the bug

Using Eleventy's built-in Render plugin breaks a function I defined in a webc:setup block, but only on the first build of the site. The error message doesn't even make sense. What could be the cause of this?

I have a component with a function to show a number of posts based on a dynamic attribute:
_components/collections-post.webc:

<script webc:setup>
    // Return the last n posts in reverse order
    const recent_posts = (n) => {
        const posts = collections.post
        const sorted = posts.sort((a, b) => a.page.date - b.page.date)
        const top = sorted.slice(0 - n)
        return top.reverse()
    }
</script>

<div class="h-feed">
    <article class="collections-post h-entry" webc:for="post of recent_posts(numposts)">
        <template @html="post.content" webc:nokeep></template>
    </article>
</div>

I use this on WebC pages like home.webc and blog.webc...

<collections-post @numposts="3"></collections-post>

I started using renderTemplate so that I could use a WebC component in my Markdown posts.

{% renderTemplate "webc" %}
    <rsvp
        answer="yes"
        url="https://example.com"
        event="Fun Event #20"
    ></rsvp>
{% endrenderTemplate %}

This worked when I first added renderTemplate and the <rsvp> component but, when I remove the output directory to rebuilt the entire site I get an error that doesn't make any sense...

[11ty] Problem writing Eleventy templates: (more in DEBUG output)
[11ty] 1. Having trouble rendering webc template ./_input/blog.webc (via TemplateContentRenderError)
[11ty] 2. Check the dynamic attribute: `webc:for="recent_posts(numposts)"`.
[11ty] Original error message: Cannot read properties of undefined (reading 'post') (via Error)
[11ty] 
[11ty] Original error stack trace: Error: Check the dynamic attribute: `webc:for="recent_posts(numposts)"`.
[11ty] Original error message: Cannot read properties of undefined (reading 'post')

It's saying that post is undefined, but that's in a webc:for block and it shouldn't even get to that line if post is undefined.

I checked the dynamic attribute (numposts) and it's set in any case. If I comment out the for loop and just show the number it'll build the site and show the number:

<div class="h-feed">
    <div @text="numposts"></div>
    <div webc:ignore>
    <article class="collections-post h-entry" webc:for="post of recent_posts(numposts)">
        <template @html="post.content" webc:nokeep></template>
    </article>
    </div>
</div>

Reproduction steps

  1. Define a function in a webc:setup block that does something with a collection
  2. Use {% renderTemplate "webc" %} in any Liquid / Markdown page.
  3. Remove the output directory.
  4. Rebuild the site: npx @11ty/eleventy
  5. See an error

Expected behavior

It builds the site

Reproduction URL

No response

Screenshots

No response

VAggrippino added a commit to VAggrippino/vaggrippino.github.io that referenced this issue Jan 30, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

1 participant