What version of astro are you using?

1.2.7

Are you using an SSR adapter? If so, which one?

n/a

What package manager are you using?

npm

What operating system are you using?

Stackblitz

Describe the Bug

We have an API for passing arguments to slot children if they are functions when using the Astro.slots.render, which I’m trying to document.

Expected behaviour

The whole process looks something like this:

1. A component uses Astro.slots.render and passes an array of arguments as the second argument when rendering:

   ---
   // /src/Component.astro
   ---
   
   {Astro.slots.render('default', ['foo'])}

2. When using the component, you pass a function as its contents to be called with any arguments the component provides:

   ---
   // /src/pages/index.astro
   import Component from '../Component.astro';
   ---
   
   <Component>
     {(arg) => <strong>{arg}</strong>}
   </Component>

3. It should render the markup returned by the function in the component’s slot:

   <!-- expected output -->
   <strong>foo</strong>

Actual behaviour

Most of the above works as expected, but the HTML markup appears to be escaped resulting in <strong>foo</strong> being output as plaintext in the browser:

<strong>foo</strong>

Link to Minimal Reproducible Example

https://stackblitz.com/edit/github-kc4vjm?file=src/ComponentWhichIteratesAList.astro

Participation

• I am willing to submit a pull request for this issue.