Fix react-jsx spread children invalid emit#46565
Conversation
|
This PR doesn't have any linked issues. Please open an issue that references this PR. From there we can discuss and prioritise. |
andrewbranch
left a comment
There was a problem hiding this comment.
Seems reasonable, but just out of curiosity, why do we even allow this? I tried this in the Babel playground and they just error with
Spread children are not supported in React.
🤷
I specifically mean since the JSX emit mode has “react” in its name—should we also be emitting a grammar error in that mode? |
|
The If those options are unset/set to |
|
Not a priority right now since this syntax has been allowed but broken for some time, but maybe something we should think about next cycle. |
|
@sandersn or @weswigham can one of you double check this real quick, whoever gets here first? Hit merge if it looks good to you. Thanks! |
src/compiler/transformers/jsx.ts
Outdated
| tagName, | ||
| objectProperties, | ||
| keyAttr, | ||
| (nonWhitespaceChildren[0] as JsxExpression)?.dotDotDotToken ? 2 : length(nonWhitespaceChildren), |
There was a problem hiding this comment.
sigh if we're gunna manipulate the number like this, we should change the parameter to a isStaticChildren boolean flag instead. Don't want someone revisiting this in the future and question why it's sometimes not actually the length of the children.
7dcfc96 to
6f38b96
Compare
* Fix react-jsx spread children invalid emit * Update Baselines and/or Applied Lint Fixes * Change childrenLength parameter -> isStaticChildren Co-authored-by: TypeScript Bot <typescriptbot@microsoft.com>
Since #45693 react-jsx transforms:
<div>{...a}{...b}</div>->vs.
but a single spread child
<div>{...a}</div>->The classic react transform isn't affected (handles a single spread child), FYI:
<div>{...a}</div>->This PR fixes the react-jsx transform in case of a single spread child:
<div>{...a}</div>->