From d93f768c8cc0df12289c911b2c302d10e17ecc36 Mon Sep 17 00:00:00 2001 From: Nate Moore Date: Fri, 9 Jul 2021 09:46:19 -0500 Subject: [PATCH] Fix injection behavior for pages which contain no elements (#638) * chore: add changeset * fix(#605): inject HMR/styles even when page includes no elements * chore: update test description --- .changeset/twelve-lions-tie.md | 14 ++++++++++++++ packages/astro/src/compiler/transform/head.ts | 6 +++++- packages/astro/test/astro-hmr.test.js | 10 ++++++++++ .../fixtures/astro-hmr/src/components/Demo.astro | 8 ++++++++ .../fixtures/astro-hmr/src/pages/no-elements.astro | 4 ++++ .../no-head-el/src/pages/no-elements.astro | 6 ++++++ packages/astro/test/no-head-el.test.js | 10 ++++++++++ 7 files changed, 57 insertions(+), 1 deletion(-) create mode 100644 .changeset/twelve-lions-tie.md create mode 100644 packages/astro/test/fixtures/astro-hmr/src/components/Demo.astro create mode 100644 packages/astro/test/fixtures/astro-hmr/src/pages/no-elements.astro create mode 100644 packages/astro/test/fixtures/no-head-el/src/pages/no-elements.astro diff --git a/.changeset/twelve-lions-tie.md b/.changeset/twelve-lions-tie.md new file mode 100644 index 000000000..2010637ca --- /dev/null +++ b/.changeset/twelve-lions-tie.md @@ -0,0 +1,14 @@ +--- +'astro': patch +--- + +Add support for components defined in Frontmatter. Previously, the following code would throw an error. Now it is officially supported! + +```astro +--- +const { level = 1 } = Astro.props; +const Element = `h${level}`; +--- + +Hello world! +``` diff --git a/packages/astro/src/compiler/transform/head.ts b/packages/astro/src/compiler/transform/head.ts index 94105a03f..99ba47c87 100644 --- a/packages/astro/src/compiler/transform/head.ts +++ b/packages/astro/src/compiler/transform/head.ts @@ -24,7 +24,8 @@ export default function (opts: TransformOptions): Transformer { if (hasComponents) { return; } - + // Initialize eoh if there are no elements + eoh.enter(node); if (node.attributes && node.attributes.some(({ name }: any) => name.startsWith('client:'))) { hasComponents = true; return; @@ -36,6 +37,9 @@ export default function (opts: TransformOptions): Transformer { hasComponents = true; } }, + leave(node) { + eoh.leave(node); + }, }, Element: { enter(node) { diff --git a/packages/astro/test/astro-hmr.test.js b/packages/astro/test/astro-hmr.test.js index 2d295c0b7..1189c1f9b 100644 --- a/packages/astro/test/astro-hmr.test.js +++ b/packages/astro/test/astro-hmr.test.js @@ -39,4 +39,14 @@ HMR('Adds script to static pages too', async ({ runtime }) => { assert.ok(/window\.HMR_WEBSOCKET_PORT/.test(html), 'websocket port added'); }); +HMR('Adds script to pages even if there aren\'t any elements in the template', async ({ runtime }) => { + const result = await runtime.load('/no-elements'); + if (result.error) throw new Error(result.error); + + const html = result.contents; + const $ = doc(html); + assert.equal($('[src="/_snowpack/hmr-client.js"]').length, 1); + assert.ok(/window\.HMR_WEBSOCKET_PORT/.test(html), 'websocket port added'); +}); + HMR.run(); diff --git a/packages/astro/test/fixtures/astro-hmr/src/components/Demo.astro b/packages/astro/test/fixtures/astro-hmr/src/components/Demo.astro new file mode 100644 index 000000000..8772ee903 --- /dev/null +++ b/packages/astro/test/fixtures/astro-hmr/src/components/Demo.astro @@ -0,0 +1,8 @@ + + + My Test + + +
Hello world
+ + diff --git a/packages/astro/test/fixtures/astro-hmr/src/pages/no-elements.astro b/packages/astro/test/fixtures/astro-hmr/src/pages/no-elements.astro new file mode 100644 index 000000000..02bbe60d6 --- /dev/null +++ b/packages/astro/test/fixtures/astro-hmr/src/pages/no-elements.astro @@ -0,0 +1,4 @@ +--- +import Demo from '../components/Demo.astro'; +--- + diff --git a/packages/astro/test/fixtures/no-head-el/src/pages/no-elements.astro b/packages/astro/test/fixtures/no-head-el/src/pages/no-elements.astro new file mode 100644 index 000000000..c4266514f --- /dev/null +++ b/packages/astro/test/fixtures/no-head-el/src/pages/no-elements.astro @@ -0,0 +1,6 @@ +--- +import Something from '../components/Something.jsx'; +import Child from '../components/Child.astro'; +--- + + diff --git a/packages/astro/test/no-head-el.test.js b/packages/astro/test/no-head-el.test.js index 2ecc40531..749acd975 100644 --- a/packages/astro/test/no-head-el.test.js +++ b/packages/astro/test/no-head-el.test.js @@ -25,4 +25,14 @@ NoHeadEl('Places style and scripts before the first non-head element', async ({ assert.equal($('script[src="/_snowpack/hmr-client.js"]').length, 1, 'Only the hmr client for the page'); }); +NoHeadEl('Injects HMR script even when there are no elements on the page', async ({ runtime }) => { + const result = await runtime.load('/no-elements'); + if (result.error) throw new Error(result.error); + + const html = result.contents; + const $ = doc(html); + + assert.equal($('script[src="/_snowpack/hmr-client.js"]').length, 1, 'Only the hmr client for the page'); +}); + NoHeadEl.run();