Fix Issues with passing void elements to React with `experimentalReac…

…tChildren` flag set (#9849) * Create simple react element if element has no children * Fix for when element has text * add changeset * minor -> patch --------- Co-authored-by: Arsh <[email protected]> Co-authored-by: Nate Moore <[email protected]>
withastro · Feb 7, 2024 · 20ca315 · 20ca315
1 parent 9836ddd
commit 20ca315
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 0 deletions.
diff --git a/.changeset/metal-penguins-drum.md b/.changeset/metal-penguins-drum.md
@@ -0,0 +1,5 @@
+---
+"@astrojs/react": patch
+---
+
+Fixes an issue where passing void elements (img, etc..) did not work with the `experimentalReactChildren` option enabled
diff --git a/packages/integrations/react/client.js b/packages/integrations/react/client.js
@@ -15,6 +15,10 @@ function createReactElementFromDOMElement(element) {
 	for (const attr of element.attributes) {
 		attrs[attr.name] = attr.value;
 	}
+	// If the element has no children, we can create a simple React element
+	if (element.firstChild === null) {
+		return createElement(element.localName, attrs);
+	}
 
 	return createElement(
 		element.localName,