New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[transform-react-jsx] Add useSpread option to transform JSX #10572
Merged
Merged
Changes from 2 commits
Commits
Show all changes
12 commits
Select commit
Hold shift + click to select a range
345654d
[transform-react-jsx] Add useSpread option to transform JSX
ivandevp c547265
Merge branch 'master' into feat/use-spread
ivandevp 48d6c09
Merge branch 'master' of https://github.com/babel/babel into feat/use…
ivandevp 51fd79d
Merge branch 'master' of https://github.com/babel/babel into feat/use…
ivandevp 60aad23
Add validation for default option
ivandevp 3afabbf
Merge branch 'feat/use-spread' of https://github.com/ivandevp/babel i…
ivandevp d905397
Merge branch 'master' of https://github.com/babel/babel into feat/use…
ivandevp 617dd72
Add error when using useSpread and useBuiltIns at the same time
ivandevp 3e32a4e
Move useSpread to convertAttribute helper function
ivandevp ec9f24b
Merge branch 'master' of https://github.com/babel/babel into feat/use…
ivandevp 7b0f831
Add useSpread option to presect-react
ivandevp 35ec82b
Remove casting useSpread to boolean in preset-react option.
ivandevp File filter
Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -172,6 +172,14 @@ You can turn on the 'throwIfNamespace' flag to bypass this warning.`, | |
let _props = []; | ||
const objs = []; | ||
|
||
const useSpread = file.opts.useSpread || false; | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. I think we should also add Another thought is that may be we should give a warning (or even error) when both |
||
if (typeof useSpread !== "boolean") { | ||
throw new Error( | ||
"transform-react-jsx currently only accepts a boolean option for " + | ||
"useSpread (defaults to false)", | ||
); | ||
} | ||
|
||
const useBuiltIns = file.opts.useBuiltIns || false; | ||
if (typeof useBuiltIns !== "boolean") { | ||
throw new Error( | ||
|
@@ -185,6 +193,9 @@ You can turn on the 'throwIfNamespace' flag to bypass this warning.`, | |
if (t.isJSXSpreadAttribute(prop)) { | ||
_props = pushProps(_props, objs); | ||
objs.push(prop.argument); | ||
if (useSpread) { | ||
_props.push(t.spreadElement(prop.argument)); | ||
} | ||
} else { | ||
_props.push(convertAttribute(prop)); | ||
} | ||
|
@@ -201,12 +212,15 @@ You can turn on the 'throwIfNamespace' flag to bypass this warning.`, | |
objs.unshift(t.objectExpression([])); | ||
} | ||
|
||
const helper = useBuiltIns | ||
? t.memberExpression(t.identifier("Object"), t.identifier("assign")) | ||
: file.addHelper("extends"); | ||
|
||
// spread it | ||
attribs = t.callExpression(helper, objs); | ||
if (useSpread) { | ||
attribs = t.objectExpression(_props); | ||
} else { | ||
const helper = useBuiltIns | ||
? t.memberExpression(t.identifier("Object"), t.identifier("assign")) | ||
: file.addHelper("extends"); | ||
// spread it | ||
attribs = t.callExpression(helper, objs); | ||
} | ||
} | ||
|
||
return attribs; | ||
|
1 change: 1 addition & 0 deletions
1
...bel-plugin-transform-react-jsx/test/fixtures/useSpread/assignment-invalid-option/input.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1 @@ | ||
var div = <Component {...props} foo="bar" /> |
4 changes: 4 additions & 0 deletions
4
...plugin-transform-react-jsx/test/fixtures/useSpread/assignment-invalid-option/options.json
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,4 @@ | ||
{ | ||
"plugins": [["transform-react-jsx", { "useSpread": "invalidOption" }]], | ||
"throws": "transform-react-jsx currently only accepts a boolean option for useSpread (defaults to false)" | ||
} |
1 change: 1 addition & 0 deletions
1
packages/babel-plugin-transform-react-jsx/test/fixtures/useSpread/assignment/input.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1 @@ | ||
var div = <Component {...props} foo="bar" /> |
3 changes: 3 additions & 0 deletions
3
packages/babel-plugin-transform-react-jsx/test/fixtures/useSpread/assignment/output.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,3 @@ | ||
var div = React.createElement(Component, { ...props, | ||
foo: "bar" | ||
}); |
3 changes: 3 additions & 0 deletions
3
packages/babel-plugin-transform-react-jsx/test/fixtures/useSpread/options.json
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,3 @@ | ||
{ | ||
"plugins": [["transform-react-jsx", { "useSpread": true }]] | ||
} |
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I don't like that this accepts
0
, but let's keep it as-is for consistency with the other options of this file 🤷♀️We should revisit it in Babel 8.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
IMO, we could begin on
useSpread
now because it is a new option.useBuiltins: 0
is strange enough and it does not justify that you can even useuseSpread: 0
.