Fix Preact Forwarded Ref components not working in astro files when R…

…eact integration is enabled (#9403) * Fix Preact Forwarded Ref components not working in astro files when React integration is enabled * Handle undefined $$typeof * Add changeset * Use Symbol.for * ⚡ * Update .changeset/breezy-hairs-yell.md --------- Co-authored-by: Nate Moore <[email protected]>
withastro · Dec 18, 2023 · 7eb9fe8 · 7eb9fe8
1 parent 1e98438
commit 7eb9fe8
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 0 deletions.
diff --git a/.changeset/breezy-hairs-yell.md b/.changeset/breezy-hairs-yell.md
@@ -0,0 +1,5 @@
+---
+'@astrojs/react': patch
+---
+
+Prevents unsupported `forwardRef` components created by Preact from being rendered by React
diff --git a/packages/integrations/react/server.js b/packages/integrations/react/server.js
@@ -23,6 +23,9 @@ async function check(Component, props, children) {
 	}
 	if (typeof Component !== 'function') return false;
 
+	// Preact forwarded-ref components can be functions, which React does not support
+	if (typeof Component === 'function' && Component['$$typeof'] === Symbol.for('react.forward_ref')) return false;
+
 	if (Component.prototype != null && typeof Component.prototype.render === 'function') {
 		return React.Component.isPrototypeOf(Component) || React.PureComponent.isPrototypeOf(Component);
 	}