diff options
Diffstat (limited to 'packages')
4 files changed, 17 insertions, 1 deletions
diff --git a/packages/astro/test/fixtures/react-component/src/components/CloneElement.jsx b/packages/astro/test/fixtures/react-component/src/components/CloneElement.jsx new file mode 100644 index 000000000..809ac4aa4 --- /dev/null +++ b/packages/astro/test/fixtures/react-component/src/components/CloneElement.jsx @@ -0,0 +1,6 @@ +import { cloneElement } from 'react'; + +const ClonedWithProps = (element) => (props) => + cloneElement(element, props); + +export default ClonedWithProps(<div id="cloned">Cloned With Props</div>); 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 049b5fb6a..936e98979 100644 --- a/packages/astro/test/fixtures/react-component/src/pages/index.astro +++ b/packages/astro/test/fixtures/react-component/src/pages/index.astro @@ -6,6 +6,7 @@ import PropsSpread from '../components/PropsSpread.jsx'; import {Research2} from '../components/Research.jsx'; import Pure from '../components/Pure.jsx'; import TypeScriptComponent from '../components/TypeScriptComponent'; +import CloneElement from '../components/CloneElement'; const someProps = { text: 'Hello world!', @@ -29,5 +30,6 @@ const someProps = { <Research2 client:idle /> <TypeScriptComponent client:load /> <Pure /> + <CloneElement /> </body> </html> diff --git a/packages/astro/test/react-component.test.js b/packages/astro/test/react-component.test.js index 68624aed6..e18f7129c 100644 --- a/packages/astro/test/react-component.test.js +++ b/packages/astro/test/react-component.test.js @@ -83,6 +83,12 @@ describe('React Components', () => { expect($('#client #lazy')).to.have.lengthOf(1); expect($('#server #lazy')).to.have.lengthOf(1); }); + + it('Can pass through props with cloneElement', async () => { + const html = await fixture.readFile('/index.html'); + const $ = cheerioLoad(html); + expect($('#cloned').text()).to.equal('Cloned With Props'); + }); }); if (isWindows) return; diff --git a/packages/integrations/react/server.js b/packages/integrations/react/server.js index d73cd0681..d7aaf7755 100644 --- a/packages/integrations/react/server.js +++ b/packages/integrations/react/server.js @@ -68,8 +68,10 @@ async function renderToStaticMarkup(Component, props, { default: children, ...sl const newProps = { ...props, ...slots, - children: children != null ? React.createElement(StaticHtml, { value: children }) : undefined, }; + if(children != null) { + newProps.children = React.createElement(StaticHtml, { value: children }); + } const vnode = React.createElement(Component, newProps); let html; if (metadata && metadata.hydrate) { |