🐛 BUG: ERROR: Expected ")" but found "not"

[corteki]

What version of astro are you using?

1.0.0-beta.44

Are you using an SSR adapter? If so, which one?

None

What package manager are you using?

npm

What operating system are you using?

Windows

Describe the Bug

When trying to use a react component that renders a ReactNode prop inside a astro page, the transform fails.

Link to Minimal Reproducible Example

https://stackblitz.com/edit/github-hhv8vp?file=src/pages/index.astro

Participation

• [ ] I am willing to submit a pull request for this issue.

[natemoo-re]

.astro and .jsx are different syntaxes with different rules, despite the similarities. Astro does not support elements/components passed as props due to parsing complexities around islands. We need to improve this error message and our documentation around this.

There are a few ways to work around this:

• Use this pattern inside of .jsx files only
• Pass Test={Child} instead of Test={<Child />}. Note that this won't work if you are attempting to hydrate the component.
• Render Child as a child of the React component and use the children prop.