Skip to content
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.

Sign up for GitHub

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

Jump to bottom

[babel 8] Disallow sequence expressions in JSX expression containers #12447

Merged
merged 4 commits into from Dec 8, 2020
Merged

[babel 8] Disallow sequence expressions in JSX expression containers #12447

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
260c8d3
jsx: fix sequence expression at JSXAttributeValue (#8787)
macabeus Feb 4, 2020
9e552a6
I'm not good at booleans
nicolo-ribaudo Dec 4, 2020
11433fa
Format
nicolo-ribaudo Dec 4, 2020
a052169
Throw a recoverable error
nicolo-ribaudo Dec 4, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
2 changes: 1 addition & 1 deletion babel.config.js
View file
Open in desktop
Expand Up @@ -177,7 +177,7 @@ module.exports = function (api) {

// env vars from the cli are always strings, so !!ENV_VAR returns true for "false"
function bool(value) {
return value && value === "false" && value === "0";
return value && value !== "false" && value !== "0";
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This was a stupid error 😁

"true" -> true
"false" -> false
"0" -> false
"1" -> true
undefined -> undefined

}

// TODO(Babel 8) This polyfill is only needed for Node.js 6 and 8
Expand Down
19 changes: 18 additions & 1 deletion packages/babel-parser/src/plugins/jsx/index.js
View file
Open in desktop
Expand Up @@ -24,6 +24,8 @@ const JsxErrors = Object.freeze({
"JSX attributes must only be assigned a non-empty expression",
MissingClosingTagFragment: "Expected corresponding JSX closing tag for <>",
MissingClosingTagElement: "Expected corresponding JSX closing tag for <%0>",
UnexpectedSequenceExpression:
"Sequence expressions cannot be directly nested inside JSX. Did you mean to wrap it in parentheses (...)?",
UnsupportedJsxValue:
"JSX value should be either an expression or a quoted JSX text",
UnterminatedJsxContent: "Unterminated JSX contents",
Expand Down Expand Up @@ -344,9 +346,24 @@ export default (superClass: Class<Parser>): Class<Parser> =>
if (this.match(tt.braceR)) {
node.expression = this.jsxParseEmptyExpression();
} else {
node.expression = this.parseExpression();
const expression = this.parseExpression();

if (process.env.BABEL_8_BREAKING) {
if (
expression.type === "SequenceExpression" &&
!expression.extra?.parenthesized
) {
this.raise(
expression.expressions[1].start,
JsxErrors.UnexpectedSequenceExpression,
);
}
}

node.expression = expression;
}
this.expect(tt.braceR);

return this.finishNode(node, "JSXExpressionContainer");
}

Expand Down
1 change: 1 addition & 0 deletions packages/babel-parser/test/fixtures/jsx/basic/sequence-expression/input.js
View file
Open in desktop
@@ -0,0 +1 @@
<div>{(console.log('foo'), JSON.stringify(props))}</div>
113 changes: 113 additions & 0 deletions packages/babel-parser/test/fixtures/jsx/basic/sequence-expression/output.json
View file
Open in desktop
@@ -0,0 +1,113 @@
{
"type": "File",
"start":0,"end":56,"loc":{"start":{"line":1,"column":0},"end":{"line":1,"column":56}},
"program": {
"type": "Program",
"start":0,"end":56,"loc":{"start":{"line":1,"column":0},"end":{"line":1,"column":56}},
"sourceType": "script",
"interpreter": null,
"body": [
{
"type": "ExpressionStatement",
"start":0,"end":56,"loc":{"start":{"line":1,"column":0},"end":{"line":1,"column":56}},
"expression": {
"type": "JSXElement",
"start":0,"end":56,"loc":{"start":{"line":1,"column":0},"end":{"line":1,"column":56}},
"openingElement": {
"type": "JSXOpeningElement",
"start":0,"end":5,"loc":{"start":{"line":1,"column":0},"end":{"line":1,"column":5}},
"name": {
"type": "JSXIdentifier",
"start":1,"end":4,"loc":{"start":{"line":1,"column":1},"end":{"line":1,"column":4}},
"name": "div"
},
"attributes": [],
"selfClosing": false
},
"closingElement": {
"type": "JSXClosingElement",
"start":50,"end":56,"loc":{"start":{"line":1,"column":50},"end":{"line":1,"column":56}},
"name": {
"type": "JSXIdentifier",
"start":52,"end":55,"loc":{"start":{"line":1,"column":52},"end":{"line":1,"column":55}},
"name": "div"
}
},
"children": [
{
"type": "JSXExpressionContainer",
"start":5,"end":50,"loc":{"start":{"line":1,"column":5},"end":{"line":1,"column":50}},
"expression": {
"type": "SequenceExpression",
"start":7,"end":48,"loc":{"start":{"line":1,"column":7},"end":{"line":1,"column":48}},
"extra": {
"parenthesized": true,
"parenStart": 6
},
"expressions": [
{
"type": "CallExpression",
"start":7,"end":25,"loc":{"start":{"line":1,"column":7},"end":{"line":1,"column":25}},
"callee": {
"type": "MemberExpression",
"start":7,"end":18,"loc":{"start":{"line":1,"column":7},"end":{"line":1,"column":18}},
"object": {
"type": "Identifier",
"start":7,"end":14,"loc":{"start":{"line":1,"column":7},"end":{"line":1,"column":14},"identifierName":"console"},
"name": "console"
},
"computed": false,
"property": {
"type": "Identifier",
"start":15,"end":18,"loc":{"start":{"line":1,"column":15},"end":{"line":1,"column":18},"identifierName":"log"},
"name": "log"
}
},
"arguments": [
{
"type": "StringLiteral",
"start":19,"end":24,"loc":{"start":{"line":1,"column":19},"end":{"line":1,"column":24}},
"extra": {
"rawValue": "foo",
"raw": "'foo'"
},
"value": "foo"
}
]
},
{
"type": "CallExpression",
"start":27,"end":48,"loc":{"start":{"line":1,"column":27},"end":{"line":1,"column":48}},
"callee": {
"type": "MemberExpression",
"start":27,"end":41,"loc":{"start":{"line":1,"column":27},"end":{"line":1,"column":41}},
"object": {
"type": "Identifier",
"start":27,"end":31,"loc":{"start":{"line":1,"column":27},"end":{"line":1,"column":31},"identifierName":"JSON"},
"name": "JSON"
},
"computed": false,
"property": {
"type": "Identifier",
"start":32,"end":41,"loc":{"start":{"line":1,"column":32},"end":{"line":1,"column":41},"identifierName":"stringify"},
"name": "stringify"
}
},
"arguments": [
{
"type": "Identifier",
"start":42,"end":47,"loc":{"start":{"line":1,"column":42},"end":{"line":1,"column":47},"identifierName":"props"},
"name": "props"
}
]
}
]
}
}
]
}
}
],
"directives": []
}
}
1 change: 1 addition & 0 deletions ...ages/babel-parser/test/fixtures/jsx/errors/attribute-sequence-expression-babel-7/input.js
View file
Open in desktop
@@ -0,0 +1 @@
<div key={console.log('foo'), JSON.stringify(props)} />
3 changes: 3 additions & 0 deletions .../babel-parser/test/fixtures/jsx/errors/attribute-sequence-expression-babel-7/options.json
View file
Open in desktop
@@ -0,0 +1,3 @@
{
"BABEL_8_BREAKING": false
}
110 changes: 110 additions & 0 deletions ...s/babel-parser/test/fixtures/jsx/errors/attribute-sequence-expression-babel-7/output.json
View file
Open in desktop
@@ -0,0 +1,110 @@
{
"type": "File",
"start":0,"end":55,"loc":{"start":{"line":1,"column":0},"end":{"line":1,"column":55}},
"program": {
"type": "Program",
"start":0,"end":55,"loc":{"start":{"line":1,"column":0},"end":{"line":1,"column":55}},
"sourceType": "script",
"interpreter": null,
"body": [
{
"type": "ExpressionStatement",
"start":0,"end":55,"loc":{"start":{"line":1,"column":0},"end":{"line":1,"column":55}},
"expression": {
"type": "JSXElement",
"start":0,"end":55,"loc":{"start":{"line":1,"column":0},"end":{"line":1,"column":55}},
"openingElement": {
"type": "JSXOpeningElement",
"start":0,"end":55,"loc":{"start":{"line":1,"column":0},"end":{"line":1,"column":55}},
"name": {
"type": "JSXIdentifier",
"start":1,"end":4,"loc":{"start":{"line":1,"column":1},"end":{"line":1,"column":4}},
"name": "div"
},
"attributes": [
{
"type": "JSXAttribute",
"start":5,"end":52,"loc":{"start":{"line":1,"column":5},"end":{"line":1,"column":52}},
"name": {
"type": "JSXIdentifier",
"start":5,"end":8,"loc":{"start":{"line":1,"column":5},"end":{"line":1,"column":8}},
"name": "key"
},
"value": {
"type": "JSXExpressionContainer",
"start":9,"end":52,"loc":{"start":{"line":1,"column":9},"end":{"line":1,"column":52}},
"expression": {
"type": "SequenceExpression",
"start":10,"end":51,"loc":{"start":{"line":1,"column":10},"end":{"line":1,"column":51}},
"expressions": [
{
"type": "CallExpression",
"start":10,"end":28,"loc":{"start":{"line":1,"column":10},"end":{"line":1,"column":28}},
"callee": {
"type": "MemberExpression",
"start":10,"end":21,"loc":{"start":{"line":1,"column":10},"end":{"line":1,"column":21}},
"object": {
"type": "Identifier",
"start":10,"end":17,"loc":{"start":{"line":1,"column":10},"end":{"line":1,"column":17},"identifierName":"console"},
"name": "console"
},
"computed": false,
"property": {
"type": "Identifier",
"start":18,"end":21,"loc":{"start":{"line":1,"column":18},"end":{"line":1,"column":21},"identifierName":"log"},
"name": "log"
}
},
"arguments": [
{
"type": "StringLiteral",
"start":22,"end":27,"loc":{"start":{"line":1,"column":22},"end":{"line":1,"column":27}},
"extra": {
"rawValue": "foo",
"raw": "'foo'"
},
"value": "foo"
}
]
},
{
"type": "CallExpression",
"start":30,"end":51,"loc":{"start":{"line":1,"column":30},"end":{"line":1,"column":51}},
"callee": {
"type": "MemberExpression",
"start":30,"end":44,"loc":{"start":{"line":1,"column":30},"end":{"line":1,"column":44}},
"object": {
"type": "Identifier",
"start":30,"end":34,"loc":{"start":{"line":1,"column":30},"end":{"line":1,"column":34},"identifierName":"JSON"},
"name": "JSON"
},
"computed": false,
"property": {
"type": "Identifier",
"start":35,"end":44,"loc":{"start":{"line":1,"column":35},"end":{"line":1,"column":44},"identifierName":"stringify"},
"name": "stringify"
}
},
"arguments": [
{
"type": "Identifier",
"start":45,"end":50,"loc":{"start":{"line":1,"column":45},"end":{"line":1,"column":50},"identifierName":"props"},
"name": "props"
}
]
}
]
}
}
}
],
"selfClosing": true
},
"closingElement": null,
"children": []
}
}
],
"directives": []
}
}
1 change: 1 addition & 0 deletions packages/babel-parser/test/fixtures/jsx/errors/attribute-sequence-expression/input.js
View file
Open in desktop
@@ -0,0 +1 @@
<div key={console.log('foo'), JSON.stringify(props)} />
3 changes: 3 additions & 0 deletions packages/babel-parser/test/fixtures/jsx/errors/attribute-sequence-expression/options.json
View file
Open in desktop
@@ -0,0 +1,3 @@
{
"BABEL_8_BREAKING": true
}