Infrastructure/astro
0
Fork 0
mirror of https://github.com/withastro/astro.git synced 2024-12-23 21:53:55 -05:00
Code Issues Activity

Prevent dev from crashing when there are errors in template (#5417)

Browse source 
* Prevent dev from crashing when there are errors in template

* Adding a changeset
This commit is contained in:
Matthew Phillips 2022-11-16 12:22:35 -05:00 committed by GitHub
parent afb751dbd1
commit a9f7ff9667
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 75 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
.changeset/wild-falcons-sparkle.md Normal file
View file

@ -0,0 +1,5 @@
---
'astro': patch
---
Prevent dev from crashing when there are errors in template

18
packages/astro/src/runtime/server/render/astro.ts
View file

@ -6,6 +6,7 @@ import { HTMLBytes, markHTMLString } from '../escape.js';
import { HydrationDirectiveProps } from '../hydration.js'; import { HydrationDirectiveProps } from '../hydration.js';
import { renderChild } from './any.js'; import { renderChild } from './any.js';
import { HTMLParts } from './common.js'; import { HTMLParts } from './common.js';
import { isPromise } from '../util.js';
// In dev mode, check props and make sure they are valid for an Astro component // In dev mode, check props and make sure they are valid for an Astro component
function validateComponentProps(props: any, displayName: string) { function validateComponentProps(props: any, displayName: string) {
@ -26,10 +27,25 @@ function validateComponentProps(props: any, displayName: string) {
export class AstroComponent { export class AstroComponent {
private htmlParts: TemplateStringsArray; private htmlParts: TemplateStringsArray;
private expressions: any[]; private expressions: any[];
private error: Error | undefined;
constructor(htmlParts: TemplateStringsArray, expressions: any[]) { constructor(htmlParts: TemplateStringsArray, expressions: any[]) {
this.htmlParts = htmlParts; this.htmlParts = htmlParts;
this.expressions = expressions; this.error = undefined;
this.expressions = expressions.map(expression => {
// Wrap Promise expressions so we can catch errors
// There can only be 1 error that we rethrow from an Astro component,
// so this keeps track of whether or not we have already done so.
if(isPromise(expression)) {
return Promise.resolve(expression).catch(err => {
if(!this.error) {
this.error = err;
throw err;
}
});
}
return expression;
})
} }
get [Symbol.toStringTag]() { get [Symbol.toStringTag]() {

53
packages/astro/test/units/dev/hydration.test.js Normal file
View file

@ -0,0 +1,53 @@
import { expect } from 'chai';
import { runInContainer } from '../../../dist/core/dev/index.js';
import { createFs, createRequestAndResponse } from '../test-utils.js';
import svelte from '../../../../integrations/svelte/dist/index.js';
import { defaultLogging } from '../../test-utils.js';
const root = new URL('../../fixtures/alias/', import.meta.url);
describe('dev container', () => {
it('should not crash when reassigning a hydrated component', async () => {
const fs = createFs(
{
'/src/pages/index.astro': `
---
import Svelte from '../components/Client.svelte';
const Foo = Svelte;
const Bar = Svelte;
---
<html>
<head><title>testing</title></head>
<body>
<Foo client:load />
<Bar client:load />
</body>
</html>
`
},
root
);
await runInContainer({
fs, root,
logging: {
...defaultLogging,
// Error is expected in this test
level: 'silent'
},
userConfig: {
integrations: [svelte()]
}
}, async (container) => {
const { req, res, done } = createRequestAndResponse({
method: 'GET',
url: '/',
});
container.handle(req, res);
const html = await done;
expect(res.statusCode).to.equal(200, 'We get a 200 because the error occurs in the template, but we didn\'t crash!');
});
});
});