Improve `head` injection behavior #2436

natemoo-re · 2022-01-20T23:25:17Z

Changes

Improves Astro's head injection behavior per RFC0007
Relies on Improve renderHead behavior compiler#315

Testing

Existing tests updated

Docs

N/A

changeset-bot · 2022-01-20T23:25:20Z

⚠️ No Changeset found

Latest commit: b499ffd

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

FredKSchott · 2022-02-18T22:36:44Z

Closing as stale, feel free to reopen when ready!

natemoo-re · 2022-03-02T21:45:19Z

packages/astro/src/runtime/server/index.ts

-export async function renderPage(result: SSRResult, Component: AstroComponentFactory, props: any, children: any) {
-	const template = await renderToString(result, Component, props, children);
+export async function renderHead(result: SSRResult) {


No more renderPage entrypoint, just use renderToString.

natemoo-re · 2022-03-02T21:46:04Z

packages/astro/src/runtime/server/index.ts

+	if (template.indexOf('<!--astro:head-->') > -1) {
+		template = template.replace('<!--astro:head-->', await renderHead(result));
+	}


 is injected by the compiler. If we see this, it's at the end of the <head> element and we should inject the links/styles/scripts.

natemoo-re · 2022-03-02T21:46:40Z

packages/astro/src/runtime/server/index.ts

-		return links.join('\n') + styles.join('\n') + scripts.join('\n') + template; // if no </head>, prepend styles & scripts
-	}
-	return template.substring(0, headPos) + links.join('\n') + styles.join('\n') + scripts.join('\n') + template.substring(headPos);
+	return unescapeHTML(links.join('\n') + styles.join('\n') + scripts.join('\n') + '\n' + '<!--astro:head:injected-->');


We also add a  comment to flag that we've already injected the links/styles/scripts.

I think I understand after reading the code below.

natemoo-re · 2022-03-02T21:47:07Z

packages/astro/src/vite-plugin-astro/compile.ts

@@ -47,7 +44,6 @@ async function compile(config: AstroConfig, filename: string, source: string, vi
 	// use `sourcemap: "both"` so that sourcemap is included in the code
 	// result passed to esbuild, but also available in the catch handler.
 	const transformResult = await transform(source, {
-		as: isPage ? 'document' : 'fragment',


No more as: 'document'|'fragment'! We no longer care, every Astro file is parsed the same.

natemoo-re · 2022-03-02T21:48:51Z

packages/astro/src/core/render/core.ts

+	// handle final head injection if it hasn't happened already
+	if (html.indexOf("<!--astro:head:injected-->") == -1) {
+		html = await renderHead(result) + html;
+	}


Slight deviation from RFC0007... if we haven't injected any head elements yet, the user may not have rendered a <head> element so we just prepend them to the file.

natemoo-re · 2022-03-02T21:49:07Z

packages/astro/src/core/render/core.ts

+		html = await renderHead(result) + html;
+	}
+	// cleanup internal state flags
+	html = html.replace("<!--astro:head:injected-->", '');


Remove our flag for a nicer output.

matthewp · 2022-03-02T21:58:31Z

lgtm

* feat: add renderHead util to server * feat: remove `layouts` from config, Vite plugin * fix: improve head injection during rendering * chore: update compiler * fix: do not escape links

* Unflag the static build (#2652) * Unflag the static build * Only set legacyBuild to false if experimentalSSR is true * Use legacy build when we have to * Put a few more tests into legacy mode * Last two * Make astro-basic use the legacy build * Adds a changeset * Mark the lit test as legacy * Update yarn lock * Update based on feedback * Add --legacy-build flag * Move astro-basic test to use static build (#2682) * Move some tests over to the static build (#2677) * Move some tests over to the static build * Fix assets tests * Fix the assets tests * Fix for the client:only components * Moves asset tests to the static build * Move postcss test over to static build * Bring back legacy build for astro-basic test * Move astro-basic test to use static build * Migrate more tests to the static build (#2693) * fix: disable HMR during build (#2684) * Migrate more tests to the static build * Only prepend links in non-legacy mode * Add the 0-css tests * Convert all CSS tests to the static build * Migrate Astro global tests * Remove .only * Fix static build tests * Migrate a few more * More tests * Move the lit test back to legacy * Increase the test timeout Co-authored-by: Nate Moore <[email protected]> * Improve `head` injection behavior (#2436) * feat: add renderHead util to server * feat: remove `layouts` from config, Vite plugin * fix: improve head injection during rendering * chore: update compiler * fix: do not escape links * chore: enter `pre` mode * Replace `send` with `sirv` (#2713) * remove send * Create thick-ravens-chew.md * I feel like I'm going to screw something up * working finally! * rewrite req.url * Add tiny bit of doc * Update .gitignore Co-authored-by: Evan Boehs <[email protected]> * Move remaining tests to the static build (#2712) * Move lit test to the static build * Migrate astro-env plugin to work in the static build * Do not remove vite:define * Adds a changeset * Add a warning when passing the --experimental-static-build flag (#2718) * Add a warning when passing the --experimental-static-build flag * Disable the lint warning * [ci] release (next) (#2721) * [ci] release (next) * chore: update changeset Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com> Co-authored-by: Nate Moore <[email protected]> * 404 page (#2719) * Fix: build to 404.html in the static build * Adds a changeset * fix pnpm install missing peer deps * fix svelte version in workspace * fix lockfile * fix(webapi): add dev script * improve preview reliability (#2739) * improve preview reliability - fix broken tests * shamefully hoist to unblock * remove lit from test running * chore: update lockfile Co-authored-by: Matthew Phillips <[email protected]> Co-authored-by: Evan Boehs <[email protected]> Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com> Co-authored-by: Fred K. Schott <[email protected]>

* Unflag the static build (withastro#2652) * Unflag the static build * Only set legacyBuild to false if experimentalSSR is true * Use legacy build when we have to * Put a few more tests into legacy mode * Last two * Make astro-basic use the legacy build * Adds a changeset * Mark the lit test as legacy * Update yarn lock * Update based on feedback * Add --legacy-build flag * Move astro-basic test to use static build (withastro#2682) * Move some tests over to the static build (withastro#2677) * Move some tests over to the static build * Fix assets tests * Fix the assets tests * Fix for the client:only components * Moves asset tests to the static build * Move postcss test over to static build * Bring back legacy build for astro-basic test * Move astro-basic test to use static build * Migrate more tests to the static build (withastro#2693) * fix: disable HMR during build (withastro#2684) * Migrate more tests to the static build * Only prepend links in non-legacy mode * Add the 0-css tests * Convert all CSS tests to the static build * Migrate Astro global tests * Remove .only * Fix static build tests * Migrate a few more * More tests * Move the lit test back to legacy * Increase the test timeout Co-authored-by: Nate Moore <[email protected]> * Improve `head` injection behavior (withastro#2436) * feat: add renderHead util to server * feat: remove `layouts` from config, Vite plugin * fix: improve head injection during rendering * chore: update compiler * fix: do not escape links * chore: enter `pre` mode * Replace `send` with `sirv` (withastro#2713) * remove send * Create thick-ravens-chew.md * I feel like I'm going to screw something up * working finally! * rewrite req.url * Add tiny bit of doc * Update .gitignore Co-authored-by: Evan Boehs <[email protected]> * Move remaining tests to the static build (withastro#2712) * Move lit test to the static build * Migrate astro-env plugin to work in the static build * Do not remove vite:define * Adds a changeset * Add a warning when passing the --experimental-static-build flag (withastro#2718) * Add a warning when passing the --experimental-static-build flag * Disable the lint warning * [ci] release (next) (withastro#2721) * [ci] release (next) * chore: update changeset Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com> Co-authored-by: Nate Moore <[email protected]> * 404 page (withastro#2719) * Fix: build to 404.html in the static build * Adds a changeset * fix pnpm install missing peer deps * fix svelte version in workspace * fix lockfile * fix(webapi): add dev script * improve preview reliability (withastro#2739) * improve preview reliability - fix broken tests * shamefully hoist to unblock * remove lit from test running * chore: update lockfile Co-authored-by: Matthew Phillips <[email protected]> Co-authored-by: Evan Boehs <[email protected]> Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com> Co-authored-by: Fred K. Schott <[email protected]>

github-actions bot added the pkg: astro Related to the core `astro` package (scope) label Jan 20, 2022

FredKSchott closed this Feb 18, 2022

natemoo-re reopened this Feb 25, 2022

natemoo-re force-pushed the feat/render-head branch from 58cde2f to 0719213 Compare February 25, 2022 23:08

github-actions bot added the test label Feb 25, 2022

natemoo-re changed the base branch from main to next February 25, 2022 23:08

natemoo-re changed the title ~~[WIP] add renderHead util to server~~ Add renderHead util to server Feb 25, 2022

github-actions bot removed the test label Feb 25, 2022

natemoo-re force-pushed the feat/render-head branch from 654d6f4 to 3361b2e Compare February 25, 2022 23:57

github-actions bot added pkg: example Related to an example package (scope) feat: markdown Related to Markdown (scope) test labels Feb 25, 2022

natemoo-re force-pushed the next branch from 9c15587 to d75a56c Compare February 25, 2022 23:58

natemoo-re marked this pull request as ready for review February 25, 2022 23:59

natemoo-re force-pushed the feat/render-head branch from 3361b2e to 5dca443 Compare February 25, 2022 23:59

github-actions bot added 🚨 action Modifies GitHub Actions and removed pkg: example Related to an example package (scope) feat: markdown Related to Markdown (scope) test labels Feb 26, 2022

natemoo-re force-pushed the feat/render-head branch from a9ed6b1 to f21f296 Compare February 28, 2022 22:17

github-actions bot added pkg: example Related to an example package (scope) test labels Feb 28, 2022

natemoo-re force-pushed the next branch from 6bebf78 to 465d989 Compare February 28, 2022 22:34

natemoo-re force-pushed the feat/render-head branch from f21f296 to 9b7bfe9 Compare February 28, 2022 22:34

github-actions bot removed pkg: example Related to an example package (scope) test labels Feb 28, 2022

This was referenced Feb 28, 2022

Fix next head behavior withastro/compiler#310

Merged

Migrate more tests to the static build #2693

Merged

github-actions bot added the test label Mar 1, 2022

natemoo-re changed the title ~~Add renderHead util to server~~ Improve head injection behavior Mar 1, 2022

FredKSchott mentioned this pull request Mar 2, 2022

Improve renderHead behavior withastro/compiler#315

Merged

FredKSchott approved these changes Mar 2, 2022

View reviewed changes

natemoo-re force-pushed the feat/render-head branch from 6df486f to 9cfa73a Compare March 2, 2022 14:59

natemoo-re force-pushed the next branch from 8f08197 to e9630b8 Compare March 2, 2022 16:03

natemoo-re self-assigned this Mar 2, 2022

Nate Moore added 5 commits March 2, 2022 14:00

feat: add renderHead util to server

a766758

feat: remove layouts from config, Vite plugin

eee6fb7

fix: improve head injection during rendering

b9adc1d

chore: update compiler

6479566

fix: do not escape links

b499ffd

natemoo-re force-pushed the feat/render-head branch from 1bdf9f9 to b499ffd Compare March 2, 2022 20:20

github-actions bot removed 🚨 action Modifies GitHub Actions test labels Mar 2, 2022

natemoo-re commented Mar 2, 2022

View reviewed changes

natemoo-re merged commit b0cedc8 into next Mar 2, 2022

natemoo-re deleted the feat/render-head branch March 2, 2022 22:00

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Improve `head` injection behavior #2436

Improve `head` injection behavior #2436

natemoo-re commented Jan 20, 2022 •

edited

Loading

changeset-bot bot commented Jan 20, 2022 •

edited

Loading

FredKSchott commented Feb 18, 2022

natemoo-re Mar 2, 2022

natemoo-re Mar 2, 2022

natemoo-re Mar 2, 2022

matthewp Mar 2, 2022

matthewp Mar 2, 2022

natemoo-re Mar 2, 2022

natemoo-re Mar 2, 2022

natemoo-re Mar 2, 2022

matthewp commented Mar 2, 2022

Improve head injection behavior #2436

Improve head injection behavior #2436

Conversation

natemoo-re commented Jan 20, 2022 • edited Loading

Changes

Testing

Docs

changeset-bot bot commented Jan 20, 2022 • edited Loading

⚠️ No Changeset found

FredKSchott commented Feb 18, 2022

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

matthewp commented Mar 2, 2022

Improve `head` injection behavior #2436

Improve `head` injection behavior #2436

natemoo-re commented Jan 20, 2022 •

edited

Loading

changeset-bot bot commented Jan 20, 2022 •

edited

Loading