From b26d48d275630a0da38edcf2b6832720dc96636f Mon Sep 17 00:00:00 2001
From: Nate Moore
Date: Thu, 19 May 2022 15:21:48 -0500
Subject: [PATCH] Defer head injection until `renderPage` (#3408)
* fix(#3195, #3197): only perform head injection for renderPage
* chore: add changeset
---
.changeset/fluffy-wolves-sneeze.md | 5 +++++
packages/astro/src/runtime/server/index.ts | 2 +-
.../astro/test/astro-partial-html.test.js | 21 +++++++++++++++++++
.../src/components/Head.astro | 3 +++
.../astro-partial-html/src/pages/head.astro | 15 +++++++++++++
5 files changed, 45 insertions(+), 1 deletion(-)
create mode 100644 .changeset/fluffy-wolves-sneeze.md
create mode 100644 packages/astro/test/fixtures/astro-partial-html/src/components/Head.astro
create mode 100644 packages/astro/test/fixtures/astro-partial-html/src/pages/head.astro
diff --git a/.changeset/fluffy-wolves-sneeze.md b/.changeset/fluffy-wolves-sneeze.md
new file mode 100644
index 000000000..87efc45de
--- /dev/null
+++ b/.changeset/fluffy-wolves-sneeze.md
@@ -0,0 +1,5 @@
+---
+'astro': patch
+---
+
+Fix hydration when rendering `` elements inside of a component
diff --git a/packages/astro/src/runtime/server/index.ts b/packages/astro/src/runtime/server/index.ts
index 0d468a9d3..6cf520563 100644
--- a/packages/astro/src/runtime/server/index.ts
+++ b/packages/astro/src/runtime/server/index.ts
@@ -544,7 +544,7 @@ export async function renderToString(
}
let template = await renderAstroComponent(Component);
- return replaceHeadInjection(result, template);
+ return template;
}
export async function renderPage(
diff --git a/packages/astro/test/astro-partial-html.test.js b/packages/astro/test/astro-partial-html.test.js
index 15fc5ee36..f47857dea 100644
--- a/packages/astro/test/astro-partial-html.test.js
+++ b/packages/astro/test/astro-partial-html.test.js
@@ -48,3 +48,24 @@ describe('Partial HTML', async () => {
expect(href).to.be.ok;
});
});
+
+describe('Head Component', async () => {
+ let fixture;
+
+ before(async () => {
+ fixture = await loadFixture({
+ root: './fixtures/astro-partial-html/',
+ });
+ await fixture.build();
+ });
+
+ it('injects Astro hydration scripts', async () => {
+ const html = await fixture.readFile('/head/index.html');
+ const $ = cheerio.load(html);
+
+ const hydrationId = $('astro-root').attr('uid');
+
+ const script = $('script').html();
+ expect(script).to.match(new RegExp(hydrationId));
+ });
+});
diff --git a/packages/astro/test/fixtures/astro-partial-html/src/components/Head.astro b/packages/astro/test/fixtures/astro-partial-html/src/components/Head.astro
new file mode 100644
index 000000000..a77dd1dd8
--- /dev/null
+++ b/packages/astro/test/fixtures/astro-partial-html/src/components/Head.astro
@@ -0,0 +1,3 @@
+
+ Hello world!
+
diff --git a/packages/astro/test/fixtures/astro-partial-html/src/pages/head.astro b/packages/astro/test/fixtures/astro-partial-html/src/pages/head.astro
new file mode 100644
index 000000000..635b09699
--- /dev/null
+++ b/packages/astro/test/fixtures/astro-partial-html/src/pages/head.astro
@@ -0,0 +1,15 @@
+---
+import Head from '../components/Head.astro';
+import Component from '../components/Component.jsx';
+---
+
+
+
+
+
+
+ JSX Partial HTML
+
+
+
+