rescript-lang / rescript-compiler

The compiler for ReScript.
https://rescript-lang.org
Other
6.67k stars 442 forks source link

JSX: weird error message when using "children" as prop #7046

Open cknitt opened 1 week ago

cknitt commented 1 week ago

When one has a React component accepting children, e.g.

module A = {
  @react.component
  let make = (~children) => <div> {children} </div>
}

and, instead of passing the children like this:

let _ = <A> {React.string("test")} </A>

one accidentally passes them as a prop:

let _ = <A children={React.string("test")} />

then one gets the error message

JSX: somehow there's more than one `children` label

which feels weird as children were actually passed only once.

zth commented 1 week ago

What should it say? "Children should be passed as JSX, not a prop"?

mununki commented 6 days ago
let _ = <A children={React.string("test")} />

I not certainly sure, is it allowed in the React usage? As far as I know it is not allowed.

cknitt commented 6 days ago

I not certainly sure, is it allowed in the React usage? As far as I know it is not allowed.

It seems to work in babel.

I am not saying that we should allow it in ReScript, just that the error message is confusing in this case.

What should it say? "Children should be passed as JSX, not a prop"?

"Children must be passed as JSX content, not as a prop. Ensure that child elements are placed between the opening and closing tags of the component."