diff --git a/packages/astro/test/fixtures/preact-component/src/components/ArrowFunction.jsx b/packages/astro/test/fixtures/preact-component/src/components/ArrowFunction.jsx new file mode 100644 index 000000000..e9bd13b21 --- /dev/null +++ b/packages/astro/test/fixtures/preact-component/src/components/ArrowFunction.jsx @@ -0,0 +1,5 @@ +import { h, Component } from 'preact'; + +export default () => { + return
; +} \ No newline at end of file diff --git a/packages/astro/test/fixtures/preact-component/src/pages/fn.astro b/packages/astro/test/fixtures/preact-component/src/pages/fn.astro index 07a2c7e3e..ced75e301 100644 --- a/packages/astro/test/fixtures/preact-component/src/pages/fn.astro +++ b/packages/astro/test/fixtures/preact-component/src/pages/fn.astro @@ -1,5 +1,6 @@ --- import FunctionComponent from '../components/Function.jsx'; +import ArrowFunctionComponent from '../components/ArrowFunction.jsx'; --- @@ -8,5 +9,6 @@ import FunctionComponent from '../components/Function.jsx'; + \ No newline at end of file diff --git a/packages/astro/test/fixtures/react-component/src/components/ArrowFunction.jsx b/packages/astro/test/fixtures/react-component/src/components/ArrowFunction.jsx new file mode 100644 index 000000000..21b8ca173 --- /dev/null +++ b/packages/astro/test/fixtures/react-component/src/components/ArrowFunction.jsx @@ -0,0 +1,5 @@ +import React from 'react'; + +export default () => { + return
; +} \ No newline at end of file diff --git a/packages/astro/test/fixtures/react-component/src/pages/index.astro b/packages/astro/test/fixtures/react-component/src/pages/index.astro index 74475f34e..8fe0e593f 100644 --- a/packages/astro/test/fixtures/react-component/src/pages/index.astro +++ b/packages/astro/test/fixtures/react-component/src/pages/index.astro @@ -1,6 +1,7 @@ --- import Hello from '../components/Hello.jsx'; import Later from '../components/Goodbye.vue'; // use different specifier +import ArrowFunction from '../components/ArrowFunction.jsx'; --- @@ -10,5 +11,6 @@ import Later from '../components/Goodbye.vue'; // use different specifier + diff --git a/packages/astro/test/preact-component.test.js b/packages/astro/test/preact-component.test.js index 5971cc174..77e17e03c 100644 --- a/packages/astro/test/preact-component.test.js +++ b/packages/astro/test/preact-component.test.js @@ -21,6 +21,7 @@ PreactComponent('Can load function component', async ({ runtime }) => { const $ = doc(result.contents); assert.equal($('#fn-component').length, 1, 'Can use function components'); + assert.equal($('#arrow-fn-component').length, 1, 'Can use function components'); }); PreactComponent('Can use hooks', async ({ runtime }) => { diff --git a/packages/astro/test/react-component.test.js b/packages/astro/test/react-component.test.js index a638bd1c4..738664ad4 100644 --- a/packages/astro/test/react-component.test.js +++ b/packages/astro/test/react-component.test.js @@ -39,6 +39,7 @@ React('Can load React', async () => { const $ = doc(result.contents); assert.equal($('#react-h2').text(), 'Hello world!'); + assert.equal($('#arrow-fn-component').length, 1, 'Can use function components'); }); React('Can load Vue', async () => { diff --git a/packages/renderers/renderer-preact/server.js b/packages/renderers/renderer-preact/server.js index a46bb39b2..8465dbe69 100644 --- a/packages/renderers/renderer-preact/server.js +++ b/packages/renderers/renderer-preact/server.js @@ -5,7 +5,7 @@ import StaticHtml from './static-html.js'; function check(Component, props, children) { if (typeof Component !== 'function') return false; - if (typeof Component.prototype.render === 'function') { + if (Component.prototype != null && typeof Component.prototype.render === 'function') { return BaseComponent.isPrototypeOf(Component); } diff --git a/packages/renderers/renderer-react/server.js b/packages/renderers/renderer-react/server.js index 4bd9e321d..d4d9f0cf8 100644 --- a/packages/renderers/renderer-react/server.js +++ b/packages/renderers/renderer-react/server.js @@ -7,7 +7,7 @@ const reactTypeof = Symbol.for('react.element'); function check(Component, props, children) { if (typeof Component !== 'function') return false; - if (typeof Component.prototype.render === 'function') { + if (Component.prototype != null && typeof Component.prototype.render === 'function') { return BaseComponent.isPrototypeOf(Component); }