AstroContainer renderToString Slots example does not render HTML #13067
Description
Astro Info
Astro v5.1.9
Node v22.13.0
System Linux (x64)
Package Manager pnpm
Output static
Adapter @astrojs/node
Integrations @astrojs/tailwind
If this issue only occurs in one browser, which browser is a problem?
No response
Describe the Bug
Strings passed to slots are treated as text and any html is escaped, this is contrary to the expected behaviour based on the slots example in the AstroContainer docs.
The docs say that this is how you pass components to slots:
import Card from "../src/components/Card.astro";
import CardHeader from "../src/components/CardHeader.astro";
import CardFooter from "../src/components/CardFooter.astro";
const result = await container.renderToString(Card, {
slots: {
header: await container.renderToString(CardHeader),
footer: await container.renderToString(CardFooter)
}
});However when I do so, the html is rendered to the page as the html is escaped.
const counterComp = await container.renderToString(Counter, {
props: { count: counter },
});
const page = await container.renderToString(Layout, {
slots: {
default: counterComp,
},
});
console.log(counterComp);
return new Response(page, {
headers: {
"Content-Type": "text/html",
},
});Output:
<html lang="en" data-astro-cid-sckkx6r4> <head><meta charset="UTF-8"><meta name="viewport" content="width=device-width"><link rel="icon" type="image/svg+xml" href="[/favicon.svg](http://localhost:4321/favicon.svg)"><meta name="generator" content="Astro v5.1.9"><title>Astro Basics</title></head> <body data-astro-cid-sckkx6r4 data-astro-source-file="/home/matt/code/ai-chat-astro/src/layouts/Layout.astro" data-astro-source-loc="10:8"> <p id="counter" data-astro-source-file="/home/matt/code/ai-chat-astro/src/components/counter.astro" data-astro-source-loc="9:17">0</p> </body></html>The console log in my code outputs the html as a string as epected, not as escaped HTML.
What's the expected result?
I expect the HTML provided to the slots to be treated as HTML.
Link to Minimal Reproducible Example
https://stackblitz.com/edit/github-4wzju1rc?file=src%2Fpages%2Fchat.ts
Participation
- I am willing to submit a pull request for this issue.