michael/astro
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Fix injection behavior for pages which contain no elements (#638)

Browse source 
* chore: add changeset

* fix(#605): inject HMR/styles even when page includes no elements

* chore: update test description
This commit is contained in:
Nate Moore 2021-07-09 09:46:19 -05:00 committed by GitHub
parent a9f2f6f6f9
commit d93f768c8c
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 57 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
.changeset/twelve-lions-tie.md Normal file
View file

@ -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}`;
---
<Element>Hello world!</Element>
```

6
packages/astro/src/compiler/transform/head.ts
View file

@ -24,7 +24,8 @@ export default function (opts: TransformOptions): Transformer {
if (hasComponents) { if (hasComponents) {
return; return;
} }
// Initialize eoh if there are no elements
eoh.enter(node);
if (node.attributes && node.attributes.some(({ name }: any) => name.startsWith('client:'))) { if (node.attributes && node.attributes.some(({ name }: any) => name.startsWith('client:'))) {
hasComponents = true; hasComponents = true;
return; return;
@ -36,6 +37,9 @@ export default function (opts: TransformOptions): Transformer {
hasComponents = true; hasComponents = true;
} }
}, },
leave(node) {
eoh.leave(node);
},
}, },
Element: { Element: {
enter(node) { enter(node) {

10
packages/astro/test/astro-hmr.test.js
View file

@ -39,4 +39,14 @@ HMR('Adds script to static pages too', async ({ runtime }) => {
assert.ok(/window\.HMR_WEBSOCKET_PORT/.test(html), 'websocket port added'); 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(); HMR.run();

8
packages/astro/test/fixtures/astro-hmr/src/components/Demo.astro vendored Normal file
View file

@ -0,0 +1,8 @@
<html>
<head>
<title>My Test</title>
</head>
<body>
<div>Hello world</div>
</body>
</html>

4
packages/astro/test/fixtures/astro-hmr/src/pages/no-elements.astro vendored Normal file
View file

@ -0,0 +1,4 @@
---
import Demo from '../components/Demo.astro';
---
<Demo />

6
packages/astro/test/fixtures/no-head-el/src/pages/no-elements.astro vendored Normal file
View file

@ -0,0 +1,6 @@
---
import Something from '../components/Something.jsx';
import Child from '../components/Child.astro';
---
<Something client:load />
<Child />

10
packages/astro/test/no-head-el.test.js
View file

@ -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'); 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(); NoHeadEl.run();