mirror of
https://github.com/withastro/astro.git
synced 2025-01-06 22:10:10 -05:00
12a1bccc81
* feat: container APIs * chore: handle runtime mode * chore: render slots * more prototyping * Adding a changeset * fix some weirdness around types * feat: allow to inject the manifest * feat: accept a manifest * more APIs * add `route` to the options * chore * fix component instance * chore: document stuff * remove commented code * chore: add test for renderers and fixed its types * fix: update name of the example * fix regression inside tests * use `experimental_` * remove errors * need to understand the types here * remove some options that I don't deem necessary for this phase * remove superfluous comments * chore: remove useless `@ts-ignore` directive * chore: address feedback * fix regression and remove astro config * chore: fix regression * Apply suggestions from code review Co-authored-by: Sarah Rainsberger <sarah@rainsberger.ca> * ooops * restore changes --------- Co-authored-by: Matthew Phillips <matthew@skypack.dev> Co-authored-by: Sarah Rainsberger <sarah@rainsberger.ca>
1.4 KiB
1.4 KiB
| astro |
|---|
| minor |
Introduces an experimental Container API to render .astro components in isolation.
This API introduces three new functions to allow you to create a new container and render an Astro component returning either a string or a Response:
create(): creates a new instance of the container.renderToString(): renders a component and return a string.renderToResponse(): renders a component and returns theResponseemitted by the rendering phase.
The first supported use of this new API is to enable unit testing. For example, with vitest, you can create a container to render your component with test data and check the result:
import { experimental_AstroContainer as AstroContainer } from 'astro/container';
import { expect, test } from 'vitest';
import Card from '../src/components/Card.astro';
test('Card with slots', async () => {
const container = await AstroContainer.create();
const result = await container.renderToString(Card, {
slots: {
default: 'Card content',
},
});
expect(result).toContain('This is a card');
expect(result).toContain('Card content');
});
For a complete reference, see the Container API docs.
For a feature overview, and to give feedback on this experimental API, see the Container API roadmap discussion.