Fix react-jsx spread children invalid emit

[Jack Bates (jablko)]

Since #45693 react-jsx transforms:

<div>{...a}{...b}</div> ->

_jsxs("div", { children: [...a, ...b] }, void 0); // Good (HEAD)

vs.

_jsxs("div", { children: [a, b] }, void 0); // Pre-#45693 behavior

but a single spread child <div>{...a}</div> ->

_jsx("div", { children: ...a }, void 0); // Syntax error (HEAD)

The classic react transform isn't affected (handles a single spread child), FYI: <div>{...a}</div> ->

React.createElement("div", null, ...a); // Good (HEAD)

This PR fixes the react-jsx transform in case of a single spread child: <div>{...a}</div> ->

_jsxs("div", { children: [...a] }, void 0); // Good (this PR)

[TypeScript Bot (typescript-bot)]

This PR doesn't have any linked issues. Please open an issue that references this PR. From there we can discuss and prioritise.

[Andrew Branch (andrewbranch)]

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.

🤷

[Andrew Branch (andrewbranch)]

why do we even allow this

I specifically mean since the JSX emit mode has “react” in its name—should we also be emitting a grammar error in that mode?

[Jack Bates (jablko)]

The jsxFactory/jsxImportSource options allow for other runtimes, e.g. ones that distinguish between <div>{...todos}</div> and <div>{todos}</div>: react/jsx#57 (comment)

If those options are unset/set to React.createElement/react then it'd be fine to emit an error, I think 👍

[Andrew Branch (andrewbranch)]

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.

[Andrew Branch (andrewbranch)]

Nathan Shively-Sanders (@sandersn) or Wesley Wigham (@weswigham) can one of you double check this real quick, whoever gets here first? Hit merge if it looks good to you. Thanks!

[Wesley Wigham (weswigham)]

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.

[Jack Bates (jablko)]

💯