Fixes bug where Astro can't distinguish between two equal components differing only by props when hydrating (#846)
This commit is contained in:
parent
bef5103ae3
commit
e89a99f342
2 changed files with 7 additions and 1 deletions
5
.changeset/chilly-gorillas-wash.md
Normal file
5
.changeset/chilly-gorillas-wash.md
Normal file
|
@ -0,0 +1,5 @@
|
||||||
|
---
|
||||||
|
'astro': patch
|
||||||
|
---
|
||||||
|
|
||||||
|
This includes the props passed to a hydration component when generating the hash/id. This prevents multiple instances of the same component with differing props to be treated as the same component when hydrated by Astro.
|
|
@ -187,7 +187,8 @@ export function __astro_component(Component: any, metadata: AstroComponentMetada
|
||||||
}
|
}
|
||||||
|
|
||||||
// If we ARE hydrating this component, let's generate the hydration script
|
// If we ARE hydrating this component, let's generate the hydration script
|
||||||
const astroId = hash.unique(html);
|
const stringifiedProps = JSON.stringify(props);
|
||||||
|
const astroId = hash.unique(html + stringifiedProps);
|
||||||
const script = await generateHydrateScript({ instance, astroId, props }, metadata as Required<AstroComponentMetadata>);
|
const script = await generateHydrateScript({ instance, astroId, props }, metadata as Required<AstroComponentMetadata>);
|
||||||
const astroRoot = `<astro-root uid="${astroId}">${html}</astro-root>`;
|
const astroRoot = `<astro-root uid="${astroId}">${html}</astro-root>`;
|
||||||
return [astroRoot, script].join('\n');
|
return [astroRoot, script].join('\n');
|
||||||
|
|
Loading…
Add table
Reference in a new issue