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

Only pass through children prop if there are children (#4756)

Browse source
This commit is contained in:
Matthew Phillips 2022-09-14 15:42:38 -04:00 committed by GitHub
parent 098c76717a
commit c271ed35ee
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 22 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
.changeset/spotty-berries-grow.md Normal file
View file

@ -0,0 +1,5 @@
---
'@astrojs/react': patch
---
Only pass through children prop if there are children

6
packages/astro/test/fixtures/react-component/src/components/CloneElement.jsx vendored Normal file
View file

@ -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>);

2
packages/astro/test/fixtures/react-component/src/pages/index.astro vendored
View file

@ -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>

6
packages/astro/test/react-component.test.js
View file

@ -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;

4
packages/integrations/react/server.js
View file

@ -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) {