diff --git a/packages/babel-helper-builder-react-jsx/src/index.js b/packages/babel-helper-builder-react-jsx/src/index.js index f0bce14c76..5c6d478e84 100644 --- a/packages/babel-helper-builder-react-jsx/src/index.js +++ b/packages/babel-helper-builder-react-jsx/src/index.js @@ -144,7 +144,11 @@ You can set \`throwIfNamespace: false\` to bypass this warning.`, let attribs = openingPath.node.attributes; if (attribs.length) { - attribs = buildOpeningElementAttributes(attribs, file); + if (process.env.BABEL_8_BREAKING) { + attribs = t.objectExpression(attribs.map(convertAttribute)); + } else { + attribs = buildOpeningElementAttributes(attribs, file); + } } else { attribs = t.nullLiteral(); } diff --git a/packages/babel-plugin-transform-react-jsx-development/test/fixtures/linux/classic-runtime-babel-7/input.js b/packages/babel-plugin-transform-react-jsx-development/test/fixtures/linux/classic-runtime-babel-7/input.js new file mode 100644 index 0000000000..6f1e6e91c6 --- /dev/null +++ b/packages/babel-plugin-transform-react-jsx-development/test/fixtures/linux/classic-runtime-babel-7/input.js @@ -0,0 +1,10 @@ +var x = ( + <> +
+
+
+
+
+
+ + ); \ No newline at end of file diff --git a/packages/babel-plugin-transform-react-jsx-development/test/fixtures/linux/classic-runtime-babel-7/options.json b/packages/babel-plugin-transform-react-jsx-development/test/fixtures/linux/classic-runtime-babel-7/options.json new file mode 100644 index 0000000000..0f063910ca --- /dev/null +++ b/packages/babel-plugin-transform-react-jsx-development/test/fixtures/linux/classic-runtime-babel-7/options.json @@ -0,0 +1,5 @@ +{ + "BABEL_8_BREAKING": false, + "plugins": [["transform-react-jsx-development", { "runtime": "classic" }]], + "os": ["linux", "darwin"] +} diff --git a/packages/babel-plugin-transform-react-jsx-development/test/fixtures/linux/classic-runtime-babel-7/output.js b/packages/babel-plugin-transform-react-jsx-development/test/fixtures/linux/classic-runtime-babel-7/output.js new file mode 100644 index 0000000000..757cd80a15 --- /dev/null +++ b/packages/babel-plugin-transform-react-jsx-development/test/fixtures/linux/classic-runtime-babel-7/output.js @@ -0,0 +1,45 @@ +var _jsxFileName = "/packages/babel-plugin-transform-react-jsx-development/test/fixtures/linux/classic-runtime-babel-7/input.js"; + +function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); } + +var x = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", { + __self: this, + __source: { + fileName: _jsxFileName, + lineNumber: 3, + columnNumber: 5 + } +}, /*#__PURE__*/React.createElement("div", { + key: "1", + __self: this, + __source: { + fileName: _jsxFileName, + lineNumber: 4, + columnNumber: 9 + } +}), /*#__PURE__*/React.createElement("div", { + key: "2", + meow: "wolf", + __self: this, + __source: { + fileName: _jsxFileName, + lineNumber: 5, + columnNumber: 9 + } +}), /*#__PURE__*/React.createElement("div", { + key: "3", + __self: this, + __source: { + fileName: _jsxFileName, + lineNumber: 6, + columnNumber: 9 + } +}), /*#__PURE__*/React.createElement("div", _extends({}, props, { + key: "4", + __self: this, + __source: { + fileName: _jsxFileName, + lineNumber: 7, + columnNumber: 9 + } +})))); diff --git a/packages/babel-plugin-transform-react-jsx-development/test/fixtures/linux/classic-runtime/options.json b/packages/babel-plugin-transform-react-jsx-development/test/fixtures/linux/classic-runtime/options.json index 5f1b689d65..0514b151f1 100644 --- a/packages/babel-plugin-transform-react-jsx-development/test/fixtures/linux/classic-runtime/options.json +++ b/packages/babel-plugin-transform-react-jsx-development/test/fixtures/linux/classic-runtime/options.json @@ -1,4 +1,5 @@ { + "BABEL_8_BREAKING": true, "plugins": [["transform-react-jsx-development", { "runtime": "classic" }]], "os": ["linux", "darwin"] } diff --git a/packages/babel-plugin-transform-react-jsx-development/test/fixtures/linux/classic-runtime/output.js b/packages/babel-plugin-transform-react-jsx-development/test/fixtures/linux/classic-runtime/output.js index f3197c5c9a..b73da88e5f 100644 --- a/packages/babel-plugin-transform-react-jsx-development/test/fixtures/linux/classic-runtime/output.js +++ b/packages/babel-plugin-transform-react-jsx-development/test/fixtures/linux/classic-runtime/output.js @@ -1,7 +1,4 @@ var _jsxFileName = "/packages/babel-plugin-transform-react-jsx-development/test/fixtures/linux/classic-runtime/input.js"; - -function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); } - var x = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", { __self: this, __source: { @@ -34,7 +31,7 @@ var x = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/Reac lineNumber: 6, columnNumber: 9 } -}), /*#__PURE__*/React.createElement("div", _extends({}, props, { +}), /*#__PURE__*/React.createElement("div", { ...props, key: "4", __self: this, __source: { @@ -42,4 +39,4 @@ var x = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/Reac lineNumber: 7, columnNumber: 9 } -})))); +}))); diff --git a/packages/babel-plugin-transform-react-jsx-development/test/fixtures/windows/classic-runtime-windows-babel-7/input.js b/packages/babel-plugin-transform-react-jsx-development/test/fixtures/windows/classic-runtime-windows-babel-7/input.js new file mode 100644 index 0000000000..28cff70081 --- /dev/null +++ b/packages/babel-plugin-transform-react-jsx-development/test/fixtures/windows/classic-runtime-windows-babel-7/input.js @@ -0,0 +1,10 @@ +var x = ( + <> +
+
+
+
+
+
+ +); diff --git a/packages/babel-plugin-transform-react-jsx-development/test/fixtures/windows/classic-runtime-windows-babel-7/options.json b/packages/babel-plugin-transform-react-jsx-development/test/fixtures/windows/classic-runtime-windows-babel-7/options.json new file mode 100644 index 0000000000..6861239caf --- /dev/null +++ b/packages/babel-plugin-transform-react-jsx-development/test/fixtures/windows/classic-runtime-windows-babel-7/options.json @@ -0,0 +1,4 @@ +{ + "BABEL_8_BREAKING": false, + "plugins": [["transform-react-jsx-development", { "runtime": "classic" }]] +} diff --git a/packages/babel-plugin-transform-react-jsx-development/test/fixtures/windows/classic-runtime-windows-babel-7/output.js b/packages/babel-plugin-transform-react-jsx-development/test/fixtures/windows/classic-runtime-windows-babel-7/output.js new file mode 100644 index 0000000000..6c663aa850 --- /dev/null +++ b/packages/babel-plugin-transform-react-jsx-development/test/fixtures/windows/classic-runtime-windows-babel-7/output.js @@ -0,0 +1,45 @@ +var _jsxFileName = "\\packages\\babel-plugin-transform-react-jsx-development\\test\\fixtures\\windows\\classic-runtime-windows-babel-7\\input.js"; + +function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); } + +var x = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", { + __self: this, + __source: { + fileName: _jsxFileName, + lineNumber: 3, + columnNumber: 5 + } +}, /*#__PURE__*/React.createElement("div", { + key: "1", + __self: this, + __source: { + fileName: _jsxFileName, + lineNumber: 4, + columnNumber: 7 + } +}), /*#__PURE__*/React.createElement("div", { + key: "2", + meow: "wolf", + __self: this, + __source: { + fileName: _jsxFileName, + lineNumber: 5, + columnNumber: 7 + } +}), /*#__PURE__*/React.createElement("div", { + key: "3", + __self: this, + __source: { + fileName: _jsxFileName, + lineNumber: 6, + columnNumber: 7 + } +}), /*#__PURE__*/React.createElement("div", _extends({}, props, { + key: "4", + __self: this, + __source: { + fileName: _jsxFileName, + lineNumber: 7, + columnNumber: 7 + } +})))); diff --git a/packages/babel-plugin-transform-react-jsx-development/test/fixtures/windows/classic-runtime-windows/options.json b/packages/babel-plugin-transform-react-jsx-development/test/fixtures/windows/classic-runtime-windows/options.json index 802b778068..d28905ca5e 100644 --- a/packages/babel-plugin-transform-react-jsx-development/test/fixtures/windows/classic-runtime-windows/options.json +++ b/packages/babel-plugin-transform-react-jsx-development/test/fixtures/windows/classic-runtime-windows/options.json @@ -1,3 +1,4 @@ { + "BABEL_8_BREAKING": true, "plugins": [["transform-react-jsx-development", { "runtime": "classic" }]] } diff --git a/packages/babel-plugin-transform-react-jsx-development/test/fixtures/windows/classic-runtime-windows/output.js b/packages/babel-plugin-transform-react-jsx-development/test/fixtures/windows/classic-runtime-windows/output.js index df7c78ba13..07220e9b9b 100644 --- a/packages/babel-plugin-transform-react-jsx-development/test/fixtures/windows/classic-runtime-windows/output.js +++ b/packages/babel-plugin-transform-react-jsx-development/test/fixtures/windows/classic-runtime-windows/output.js @@ -1,7 +1,4 @@ var _jsxFileName = "\\packages\\babel-plugin-transform-react-jsx-development\\test\\fixtures\\windows\\classic-runtime-windows\\input.js"; - -function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); } - var x = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", { __self: this, __source: { @@ -15,7 +12,7 @@ var x = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/Reac __source: { fileName: _jsxFileName, lineNumber: 4, - columnNumber: 7 + columnNumber: 9 } }), /*#__PURE__*/React.createElement("div", { key: "2", @@ -24,7 +21,7 @@ var x = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/Reac __source: { fileName: _jsxFileName, lineNumber: 5, - columnNumber: 7 + columnNumber: 9 } }), /*#__PURE__*/React.createElement("div", { key: "3", @@ -32,14 +29,14 @@ var x = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/Reac __source: { fileName: _jsxFileName, lineNumber: 6, - columnNumber: 7 + columnNumber: 9 } -}), /*#__PURE__*/React.createElement("div", _extends({}, props, { +}), /*#__PURE__*/React.createElement("div", { ...props, key: "4", __self: this, __source: { fileName: _jsxFileName, lineNumber: 7, - columnNumber: 7 + columnNumber: 9 } -})))); +}))); diff --git a/packages/babel-plugin-transform-react-jsx/src/create-plugin.js b/packages/babel-plugin-transform-react-jsx/src/create-plugin.js index ab074f8517..14fc82e20d 100644 --- a/packages/babel-plugin-transform-react-jsx/src/create-plugin.js +++ b/packages/babel-plugin-transform-react-jsx/src/create-plugin.js @@ -30,10 +30,6 @@ export default function createPlugin({ name, development }) { // TODO (Babel 8): It should throw if this option is used with the automatic runtime filter, - // TODO (Babel 8): Remove `useBuiltIns` & `useSpread` - useSpread = false, - useBuiltIns = false, - runtime: RUNTIME_DEFAULT = development ? "automatic" : "classic", importSource: IMPORT_SOURCE_DEFAULT = DEFAULT.importSource, @@ -41,27 +37,52 @@ export default function createPlugin({ name, development }) { pragmaFrag: PRAGMA_FRAG_DEFAULT = DEFAULT.pragmaFrag, } = options; - // TOOD(Babel 8): If the runtime is 'automatic', we should throw when useSpread/useBuiltIns are set - if (RUNTIME_DEFAULT === "classic") { - if (typeof useSpread !== "boolean") { + if (process.env.BABEL_8_BREAKING) { + if ("useSpread" in options) { throw new Error( - "transform-react-jsx currently only accepts a boolean option for " + - "useSpread (defaults to false)", + '@babel/plugin-transform-react-jsx: Since Babel 8, an inline object with spread elements is always used, and the "useSpread" option is no longer available. Please remove it from your config.', ); } - if (typeof useBuiltIns !== "boolean") { + if ("useBuiltIns" in options) { + const useBuiltInsFormatted = JSON.stringify(options.useBuiltIns); throw new Error( - "transform-react-jsx currently only accepts a boolean option for " + - "useBuiltIns (defaults to false)", + `@babel/plugin-transform-react-jsx: Since "useBuiltIns" is removed in Babel 8, you can remove it from the config. +- Babel 8 now transforms JSX spread to object spread. If you need to transpile object spread with +\`useBuiltIns: ${useBuiltInsFormatted}\`, you can use the following config +{ + "plugins": [ + "@babel/plugin-transform-react-jsx" + ["@babel/plugin-proposal-object-rest-spread", { "loose": true, "useBuiltIns": ${useBuiltInsFormatted} }] + ] +}`, ); } + } else { + // eslint-disable-next-line no-var + var { useSpread = false, useBuiltIns = false } = options; - if (useSpread && useBuiltIns) { - throw new Error( - "transform-react-jsx currently only accepts useBuiltIns or useSpread " + - "but not both", - ); + if (RUNTIME_DEFAULT === "classic") { + if (typeof useSpread !== "boolean") { + throw new Error( + "transform-react-jsx currently only accepts a boolean option for " + + "useSpread (defaults to false)", + ); + } + + if (typeof useBuiltIns !== "boolean") { + throw new Error( + "transform-react-jsx currently only accepts a boolean option for " + + "useBuiltIns (defaults to false)", + ); + } + + if (useSpread && useBuiltIns) { + throw new Error( + "transform-react-jsx currently only accepts useBuiltIns or useSpread " + + "but not both", + ); + } } } @@ -519,72 +540,78 @@ You can set \`throwIfNamespace: false\` to bypass this warning.`, * all prior attributes to an array for later processing. */ function buildCreateElementOpeningElementAttributes(file, path, attribs) { - // TODO (Babel 8): Only leave this branch of the code and remove the rest - if ( - RUNTIME_DEFAULT === "automatic" || - get(file, "runtime") === "automatic" - ) { - const props = []; - const found = Object.create(null); + const runtime = get(file, "runtime"); + if (!process.env.BABEL_8_BREAKING) { + if (runtime !== "automatic") { + const objs = []; + const props = attribs.reduce(accumulateAttribute, []); - for (const attr of attribs) { - const name = - t.isJSXAttribute(attr) && - t.isJSXIdentifier(attr.name) && - attr.name.name; - - if (name === "__source" || name === "__self") { - if (found[name]) throw sourceSelfError(path, name); - found[name] = true; - } - - accumulateAttribute(props, attr); - } - - return props.length > 0 ? t.objectExpression(props) : t.nullLiteral(); - } - - const objs = []; - const props = attribs.reduce(accumulateAttribute, []); - - if (!useSpread) { - // Convert syntax to use multiple objects instead of spread - let start = 0; - props.forEach((prop, i) => { - if (t.isSpreadElement(prop)) { - if (i > start) { - objs.push(t.objectExpression(props.slice(start, i))); + if (!useSpread) { + // Convert syntax to use multiple objects instead of spread + let start = 0; + props.forEach((prop, i) => { + if (t.isSpreadElement(prop)) { + if (i > start) { + objs.push(t.objectExpression(props.slice(start, i))); + } + objs.push(prop.argument); + start = i + 1; + } + }); + if (props.length > start) { + objs.push(t.objectExpression(props.slice(start))); } - objs.push(prop.argument); - start = i + 1; + } else if (props.length) { + objs.push(t.objectExpression(props)); } - }); - if (props.length > start) { - objs.push(t.objectExpression(props.slice(start))); + + if (!objs.length) { + return t.nullLiteral(); + } + + if (objs.length === 1) { + return objs[0]; + } + + // looks like we have multiple objects + if (!t.isObjectExpression(objs[0])) { + objs.unshift(t.objectExpression([])); + } + + const helper = useBuiltIns + ? t.memberExpression(t.identifier("Object"), t.identifier("assign")) + : file.addHelper("extends"); + + // spread it + return t.callExpression(helper, objs); } - } else if (props.length) { - objs.push(t.objectExpression(props)); } - if (!objs.length) { - return t.nullLiteral(); + const props = []; + const found = Object.create(null); + + for (const attr of attribs) { + const name = + t.isJSXAttribute(attr) && + t.isJSXIdentifier(attr.name) && + attr.name.name; + + if ( + runtime === "automatic" && + (name === "__source" || name === "__self") + ) { + if (found[name]) throw sourceSelfError(path, name); + found[name] = true; + } + + accumulateAttribute(props, attr); } - if (objs.length === 1) { - return objs[0]; - } - - // looks like we have multiple objects - if (!t.isObjectExpression(objs[0])) { - objs.unshift(t.objectExpression([])); - } - - const helper = useBuiltIns - ? t.memberExpression(t.identifier("Object"), t.identifier("assign")) - : file.addHelper("extends"); - - // spread it - return t.callExpression(helper, objs); + return props.length === 1 && t.isSpreadElement(props[0]) + ? props[0].argument + : props.length > 0 + ? t.objectExpression(props) + : t.nullLiteral(); } }); diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/react/adds-appropriate-newlines-when-using-spread-attribute-babel-7/input.js b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/adds-appropriate-newlines-when-using-spread-attribute-babel-7/input.js new file mode 100644 index 0000000000..2c800f1558 --- /dev/null +++ b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/adds-appropriate-newlines-when-using-spread-attribute-babel-7/input.js @@ -0,0 +1,3 @@ + diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/react/adds-appropriate-newlines-when-using-spread-attribute-babel-7/options.json b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/adds-appropriate-newlines-when-using-spread-attribute-babel-7/options.json new file mode 100644 index 0000000000..29a3f0e841 --- /dev/null +++ b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/adds-appropriate-newlines-when-using-spread-attribute-babel-7/options.json @@ -0,0 +1,3 @@ +{ + "BABEL_8_BREAKING": false +} diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/react/adds-appropriate-newlines-when-using-spread-attribute-babel-7/output.js b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/adds-appropriate-newlines-when-using-spread-attribute-babel-7/output.js new file mode 100644 index 0000000000..bfd6ae7c13 --- /dev/null +++ b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/adds-appropriate-newlines-when-using-spread-attribute-babel-7/output.js @@ -0,0 +1,4 @@ +/*#__PURE__*/ +React.createElement(Component, babelHelpers.extends({}, props, { + sound: "moo" +})); diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/react/adds-appropriate-newlines-when-using-spread-attribute/options.json b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/adds-appropriate-newlines-when-using-spread-attribute/options.json new file mode 100644 index 0000000000..cbf6d15954 --- /dev/null +++ b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/adds-appropriate-newlines-when-using-spread-attribute/options.json @@ -0,0 +1,3 @@ +{ + "BABEL_8_BREAKING": true +} diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/react/adds-appropriate-newlines-when-using-spread-attribute/output.js b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/adds-appropriate-newlines-when-using-spread-attribute/output.js index bfd6ae7c13..b07ab7c68f 100644 --- a/packages/babel-plugin-transform-react-jsx/test/fixtures/react/adds-appropriate-newlines-when-using-spread-attribute/output.js +++ b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/adds-appropriate-newlines-when-using-spread-attribute/output.js @@ -1,4 +1,4 @@ /*#__PURE__*/ -React.createElement(Component, babelHelpers.extends({}, props, { +React.createElement(Component, { ...props, sound: "moo" -})); +}); diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/useBuiltIns/assignment-invalid-option/input.js b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/assignment-babel-7/input.js similarity index 100% rename from packages/babel-plugin-transform-react-jsx/test/fixtures/useBuiltIns/assignment-invalid-option/input.js rename to packages/babel-plugin-transform-react-jsx/test/fixtures/react/assignment-babel-7/input.js diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/react/assignment-babel-7/options.json b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/assignment-babel-7/options.json new file mode 100644 index 0000000000..29a3f0e841 --- /dev/null +++ b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/assignment-babel-7/options.json @@ -0,0 +1,3 @@ +{ + "BABEL_8_BREAKING": false +} diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/react/assignment-babel-7/output.js b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/assignment-babel-7/output.js new file mode 100644 index 0000000000..5d6aec1438 --- /dev/null +++ b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/assignment-babel-7/output.js @@ -0,0 +1,3 @@ +var div = /*#__PURE__*/React.createElement(Component, babelHelpers.extends({}, props, { + foo: "bar" +})); diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/react/assignment/options.json b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/assignment/options.json new file mode 100644 index 0000000000..cbf6d15954 --- /dev/null +++ b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/assignment/options.json @@ -0,0 +1,3 @@ +{ + "BABEL_8_BREAKING": true +} diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/react/assignment/output.js b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/assignment/output.js index 5d6aec1438..0c5b1f75b0 100644 --- a/packages/babel-plugin-transform-react-jsx/test/fixtures/react/assignment/output.js +++ b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/assignment/output.js @@ -1,3 +1,3 @@ -var div = /*#__PURE__*/React.createElement(Component, babelHelpers.extends({}, props, { +var div = /*#__PURE__*/React.createElement(Component, { ...props, foo: "bar" -})); +}); diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/react/avoids-spread/input.js b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/avoids-spread-babel-7/input.js similarity index 100% rename from packages/babel-plugin-transform-react-jsx/test/fixtures/react/avoids-spread/input.js rename to packages/babel-plugin-transform-react-jsx/test/fixtures/react/avoids-spread-babel-7/input.js diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/react/avoids-spread-babel-7/options.json b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/avoids-spread-babel-7/options.json new file mode 100644 index 0000000000..29a3f0e841 --- /dev/null +++ b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/avoids-spread-babel-7/options.json @@ -0,0 +1,3 @@ +{ + "BABEL_8_BREAKING": false +} diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/react/avoids-spread/output.js b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/avoids-spread-babel-7/output.js similarity index 100% rename from packages/babel-plugin-transform-react-jsx/test/fixtures/react/avoids-spread/output.js rename to packages/babel-plugin-transform-react-jsx/test/fixtures/react/avoids-spread-babel-7/output.js diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/react/does-not-add-source-self-babel-7/input.mjs b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/does-not-add-source-self-babel-7/input.mjs new file mode 100644 index 0000000000..ebd66ec03e --- /dev/null +++ b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/does-not-add-source-self-babel-7/input.mjs @@ -0,0 +1,10 @@ +var x = ( + <> +
+
+
+
+
+
+ +); diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/react/does-not-add-source-self-babel-7/options.json b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/does-not-add-source-self-babel-7/options.json new file mode 100644 index 0000000000..29a3f0e841 --- /dev/null +++ b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/does-not-add-source-self-babel-7/options.json @@ -0,0 +1,3 @@ +{ + "BABEL_8_BREAKING": false +} diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/react/does-not-add-source-self-babel-7/output.mjs b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/does-not-add-source-self-babel-7/output.mjs new file mode 100644 index 0000000000..76b2c3a6a3 --- /dev/null +++ b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/does-not-add-source-self-babel-7/output.mjs @@ -0,0 +1,10 @@ +var x = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", { + key: "1" +}), /*#__PURE__*/React.createElement("div", { + key: "2", + meow: "wolf" +}), /*#__PURE__*/React.createElement("div", { + key: "3" +}), /*#__PURE__*/React.createElement("div", babelHelpers.extends({}, props, { + key: "4" +})))); diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/react/does-not-add-source-self/options.json b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/does-not-add-source-self/options.json new file mode 100644 index 0000000000..cbf6d15954 --- /dev/null +++ b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/does-not-add-source-self/options.json @@ -0,0 +1,3 @@ +{ + "BABEL_8_BREAKING": true +} diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/react/does-not-add-source-self/output.mjs b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/does-not-add-source-self/output.mjs index 76b2c3a6a3..3466065a8d 100644 --- a/packages/babel-plugin-transform-react-jsx/test/fixtures/react/does-not-add-source-self/output.mjs +++ b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/does-not-add-source-self/output.mjs @@ -5,6 +5,6 @@ var x = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/Reac meow: "wolf" }), /*#__PURE__*/React.createElement("div", { key: "3" -}), /*#__PURE__*/React.createElement("div", babelHelpers.extends({}, props, { +}), /*#__PURE__*/React.createElement("div", { ...props, key: "4" -})))); +}))); diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-first-spread-attributes-babel-7/input.js b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-first-spread-attributes-babel-7/input.js new file mode 100644 index 0000000000..4e9432dfa3 --- /dev/null +++ b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-first-spread-attributes-babel-7/input.js @@ -0,0 +1,2 @@ + diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-first-spread-attributes-babel-7/options.json b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-first-spread-attributes-babel-7/options.json new file mode 100644 index 0000000000..29a3f0e841 --- /dev/null +++ b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-first-spread-attributes-babel-7/options.json @@ -0,0 +1,3 @@ +{ + "BABEL_8_BREAKING": false +} diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-first-spread-attributes-babel-7/output.js b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-first-spread-attributes-babel-7/output.js new file mode 100644 index 0000000000..b6fe512bfd --- /dev/null +++ b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-first-spread-attributes-babel-7/output.js @@ -0,0 +1,5 @@ +/*#__PURE__*/ +React.createElement(Component, babelHelpers.extends({}, x, { + y: 2, + z: true +})); diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-first-spread-attributes/options.json b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-first-spread-attributes/options.json new file mode 100644 index 0000000000..cbf6d15954 --- /dev/null +++ b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-first-spread-attributes/options.json @@ -0,0 +1,3 @@ +{ + "BABEL_8_BREAKING": true +} diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-first-spread-attributes/output.js b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-first-spread-attributes/output.js index b6fe512bfd..f3e155af3c 100644 --- a/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-first-spread-attributes/output.js +++ b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-first-spread-attributes/output.js @@ -1,5 +1,5 @@ /*#__PURE__*/ -React.createElement(Component, babelHelpers.extends({}, x, { +React.createElement(Component, { ...x, y: 2, z: true -})); +}); diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-last-spread-attributes-babel-7/input.js b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-last-spread-attributes-babel-7/input.js new file mode 100644 index 0000000000..ce7fb5b60f --- /dev/null +++ b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-last-spread-attributes-babel-7/input.js @@ -0,0 +1 @@ + diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-last-spread-attributes-babel-7/options.json b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-last-spread-attributes-babel-7/options.json new file mode 100644 index 0000000000..29a3f0e841 --- /dev/null +++ b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-last-spread-attributes-babel-7/options.json @@ -0,0 +1,3 @@ +{ + "BABEL_8_BREAKING": false +} diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-last-spread-attributes-babel-7/output.js b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-last-spread-attributes-babel-7/output.js new file mode 100644 index 0000000000..c1c22b02c9 --- /dev/null +++ b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-last-spread-attributes-babel-7/output.js @@ -0,0 +1,5 @@ +/*#__PURE__*/ +React.createElement(Component, babelHelpers.extends({ + y: 2, + z: true +}, x)); diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-last-spread-attributes/options.json b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-last-spread-attributes/options.json new file mode 100644 index 0000000000..cbf6d15954 --- /dev/null +++ b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-last-spread-attributes/options.json @@ -0,0 +1,3 @@ +{ + "BABEL_8_BREAKING": true +} diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-last-spread-attributes/output.js b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-last-spread-attributes/output.js index c1c22b02c9..2131262e94 100644 --- a/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-last-spread-attributes/output.js +++ b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-last-spread-attributes/output.js @@ -1,5 +1,6 @@ /*#__PURE__*/ -React.createElement(Component, babelHelpers.extends({ +React.createElement(Component, { y: 2, - z: true -}, x)); + z: true, + ...x +}); diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-middle-spread-attributes-babel-7/input.js b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-middle-spread-attributes-babel-7/input.js new file mode 100644 index 0000000000..919adaebb4 --- /dev/null +++ b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-middle-spread-attributes-babel-7/input.js @@ -0,0 +1 @@ + diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-middle-spread-attributes-babel-7/options.json b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-middle-spread-attributes-babel-7/options.json new file mode 100644 index 0000000000..29a3f0e841 --- /dev/null +++ b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-middle-spread-attributes-babel-7/options.json @@ -0,0 +1,3 @@ +{ + "BABEL_8_BREAKING": false +} diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-middle-spread-attributes-babel-7/output.js b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-middle-spread-attributes-babel-7/output.js new file mode 100644 index 0000000000..7d99b1a29c --- /dev/null +++ b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-middle-spread-attributes-babel-7/output.js @@ -0,0 +1,6 @@ +/*#__PURE__*/ +React.createElement(Component, babelHelpers.extends({ + y: 2 +}, x, { + z: true +})); diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-middle-spread-attributes/options.json b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-middle-spread-attributes/options.json new file mode 100644 index 0000000000..cbf6d15954 --- /dev/null +++ b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-middle-spread-attributes/options.json @@ -0,0 +1,3 @@ +{ + "BABEL_8_BREAKING": true +} diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-middle-spread-attributes/output.js b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-middle-spread-attributes/output.js index 7d99b1a29c..0915d43ce0 100644 --- a/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-middle-spread-attributes/output.js +++ b/packages/babel-plugin-transform-react-jsx/test/fixtures/react/wraps-props-in-react-spread-for-middle-spread-attributes/output.js @@ -1,6 +1,6 @@ /*#__PURE__*/ -React.createElement(Component, babelHelpers.extends({ - y: 2 -}, x, { +React.createElement(Component, { + y: 2, + ...x, z: true -})); +}); diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/useBuiltIns/assignment/input.js b/packages/babel-plugin-transform-react-jsx/test/fixtures/removed-options/invalid-use-builtins-false/input.js similarity index 100% rename from packages/babel-plugin-transform-react-jsx/test/fixtures/useBuiltIns/assignment/input.js rename to packages/babel-plugin-transform-react-jsx/test/fixtures/removed-options/invalid-use-builtins-false/input.js diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/removed-options/invalid-use-builtins-false/options.json b/packages/babel-plugin-transform-react-jsx/test/fixtures/removed-options/invalid-use-builtins-false/options.json new file mode 100644 index 0000000000..6e6f1869f2 --- /dev/null +++ b/packages/babel-plugin-transform-react-jsx/test/fixtures/removed-options/invalid-use-builtins-false/options.json @@ -0,0 +1,5 @@ +{ + "BABEL_8_BREAKING": true, + "plugins": [["transform-react-jsx", { "useBuiltIns": false }]], + "throws": "@babel/plugin-transform-react-jsx: Since \"useBuiltIns\" is removed in Babel 8, you can remove it from the config." +} diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/useSpread/assignment-invalid-option/input.js b/packages/babel-plugin-transform-react-jsx/test/fixtures/removed-options/invalid-use-builtins-true/input.js similarity index 100% rename from packages/babel-plugin-transform-react-jsx/test/fixtures/useSpread/assignment-invalid-option/input.js rename to packages/babel-plugin-transform-react-jsx/test/fixtures/removed-options/invalid-use-builtins-true/input.js diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/removed-options/invalid-use-builtins-true/options.json b/packages/babel-plugin-transform-react-jsx/test/fixtures/removed-options/invalid-use-builtins-true/options.json new file mode 100644 index 0000000000..f8ae81d5ef --- /dev/null +++ b/packages/babel-plugin-transform-react-jsx/test/fixtures/removed-options/invalid-use-builtins-true/options.json @@ -0,0 +1,5 @@ +{ + "BABEL_8_BREAKING": true, + "plugins": [["transform-react-jsx", { "useBuiltIns": true }]], + "throws": "@babel/plugin-transform-react-jsx: Since \"useBuiltIns\" is removed in Babel 8, you can remove it from the config." +} diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/useSpread/assignment-use-builtin/input.js b/packages/babel-plugin-transform-react-jsx/test/fixtures/removed-options/invalid-use-spread-false/input.js similarity index 100% rename from packages/babel-plugin-transform-react-jsx/test/fixtures/useSpread/assignment-use-builtin/input.js rename to packages/babel-plugin-transform-react-jsx/test/fixtures/removed-options/invalid-use-spread-false/input.js diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/removed-options/invalid-use-spread-false/options.json b/packages/babel-plugin-transform-react-jsx/test/fixtures/removed-options/invalid-use-spread-false/options.json new file mode 100644 index 0000000000..67eb92afe1 --- /dev/null +++ b/packages/babel-plugin-transform-react-jsx/test/fixtures/removed-options/invalid-use-spread-false/options.json @@ -0,0 +1,5 @@ +{ + "BABEL_8_BREAKING": true, + "plugins": [["transform-react-jsx", { "useSpread": false }]], + "throws": "transform-react-jsx: Since Babel 8, an inline object with spread elements is always used, and the \"useSpread\" option is no longer available. Please remove it from your config." +} diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/useSpread/assignment/input.js b/packages/babel-plugin-transform-react-jsx/test/fixtures/removed-options/invalid-use-spread-true/input.js similarity index 100% rename from packages/babel-plugin-transform-react-jsx/test/fixtures/useSpread/assignment/input.js rename to packages/babel-plugin-transform-react-jsx/test/fixtures/removed-options/invalid-use-spread-true/input.js diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/removed-options/invalid-use-spread-true/options.json b/packages/babel-plugin-transform-react-jsx/test/fixtures/removed-options/invalid-use-spread-true/options.json new file mode 100644 index 0000000000..edef88f4d1 --- /dev/null +++ b/packages/babel-plugin-transform-react-jsx/test/fixtures/removed-options/invalid-use-spread-true/options.json @@ -0,0 +1,5 @@ +{ + "BABEL_8_BREAKING": true, + "plugins": [["transform-react-jsx", { "useSpread": true }]], + "throws": "transform-react-jsx: Since Babel 8, an inline object with spread elements is always used, and the \"useSpread\" option is no longer available. Please remove it from your config." +} diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/spread-transform/options.json b/packages/babel-plugin-transform-react-jsx/test/fixtures/spread-transform/options.json new file mode 100644 index 0000000000..cbf6d15954 --- /dev/null +++ b/packages/babel-plugin-transform-react-jsx/test/fixtures/spread-transform/options.json @@ -0,0 +1,3 @@ +{ + "BABEL_8_BREAKING": true +} diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/spread-transform/transform-to-babel-extend/input.js b/packages/babel-plugin-transform-react-jsx/test/fixtures/spread-transform/transform-to-babel-extend/input.js new file mode 100644 index 0000000000..4caacb6aa1 --- /dev/null +++ b/packages/babel-plugin-transform-react-jsx/test/fixtures/spread-transform/transform-to-babel-extend/input.js @@ -0,0 +1 @@ +var div = diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/spread-transform/transform-to-babel-extend/options.json b/packages/babel-plugin-transform-react-jsx/test/fixtures/spread-transform/transform-to-babel-extend/options.json new file mode 100644 index 0000000000..472d8a40f6 --- /dev/null +++ b/packages/babel-plugin-transform-react-jsx/test/fixtures/spread-transform/transform-to-babel-extend/options.json @@ -0,0 +1,6 @@ +{ + "plugins": ["transform-react-jsx", ["proposal-object-rest-spread", { + "loose": true, + "useBuiltIns": false + }], "external-helpers"] +} diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/spread-transform/transform-to-babel-extend/output.js b/packages/babel-plugin-transform-react-jsx/test/fixtures/spread-transform/transform-to-babel-extend/output.js new file mode 100644 index 0000000000..5d6aec1438 --- /dev/null +++ b/packages/babel-plugin-transform-react-jsx/test/fixtures/spread-transform/transform-to-babel-extend/output.js @@ -0,0 +1,3 @@ +var div = /*#__PURE__*/React.createElement(Component, babelHelpers.extends({}, props, { + foo: "bar" +})); diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/spread-transform/transform-to-object-assign/input.js b/packages/babel-plugin-transform-react-jsx/test/fixtures/spread-transform/transform-to-object-assign/input.js new file mode 100644 index 0000000000..4caacb6aa1 --- /dev/null +++ b/packages/babel-plugin-transform-react-jsx/test/fixtures/spread-transform/transform-to-object-assign/input.js @@ -0,0 +1 @@ +var div = diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/spread-transform/transform-to-object-assign/options.json b/packages/babel-plugin-transform-react-jsx/test/fixtures/spread-transform/transform-to-object-assign/options.json new file mode 100644 index 0000000000..8a8e736aeb --- /dev/null +++ b/packages/babel-plugin-transform-react-jsx/test/fixtures/spread-transform/transform-to-object-assign/options.json @@ -0,0 +1,6 @@ +{ + "plugins": ["transform-react-jsx", ["proposal-object-rest-spread", { + "loose": true, + "useBuiltIns": true + }]] +} diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/useBuiltIns/assignment/output.js b/packages/babel-plugin-transform-react-jsx/test/fixtures/spread-transform/transform-to-object-assign/output.js similarity index 100% rename from packages/babel-plugin-transform-react-jsx/test/fixtures/useBuiltIns/assignment/output.js rename to packages/babel-plugin-transform-react-jsx/test/fixtures/spread-transform/transform-to-object-assign/output.js diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/useBuiltIns/assignment-invalid-option/options.json b/packages/babel-plugin-transform-react-jsx/test/fixtures/useBuiltIns/assignment-invalid-option/options.json deleted file mode 100644 index 3baf37938e..0000000000 --- a/packages/babel-plugin-transform-react-jsx/test/fixtures/useBuiltIns/assignment-invalid-option/options.json +++ /dev/null @@ -1,4 +0,0 @@ -{ - "plugins": [["transform-react-jsx", { "useBuiltIns": "invalidOption" }]], - "throws": "transform-react-jsx currently only accepts a boolean option for useBuiltIns (defaults to false)" -} diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/useBuiltIns/options.json b/packages/babel-plugin-transform-react-jsx/test/fixtures/useBuiltIns/options.json deleted file mode 100644 index 2404117dcc..0000000000 --- a/packages/babel-plugin-transform-react-jsx/test/fixtures/useBuiltIns/options.json +++ /dev/null @@ -1,3 +0,0 @@ -{ - "plugins": [["transform-react-jsx", { "useBuiltIns": true }]] -} diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/useSpread/assignment-invalid-option/options.json b/packages/babel-plugin-transform-react-jsx/test/fixtures/useSpread/assignment-invalid-option/options.json deleted file mode 100644 index ff6406c9a4..0000000000 --- a/packages/babel-plugin-transform-react-jsx/test/fixtures/useSpread/assignment-invalid-option/options.json +++ /dev/null @@ -1,4 +0,0 @@ -{ - "plugins": [["transform-react-jsx", { "useSpread": 0 }]], - "throws": "transform-react-jsx currently only accepts a boolean option for useSpread (defaults to false)" -} diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/useSpread/assignment-use-builtin/options.json b/packages/babel-plugin-transform-react-jsx/test/fixtures/useSpread/assignment-use-builtin/options.json deleted file mode 100644 index eab6051daa..0000000000 --- a/packages/babel-plugin-transform-react-jsx/test/fixtures/useSpread/assignment-use-builtin/options.json +++ /dev/null @@ -1,6 +0,0 @@ -{ - "plugins": [ - ["transform-react-jsx", { "useSpread": true, "useBuiltIns": true }] - ], - "throws": "transform-react-jsx currently only accepts useBuiltIns or useSpread but not both" -} diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/useSpread/assignment/output.js b/packages/babel-plugin-transform-react-jsx/test/fixtures/useSpread/assignment/output.js deleted file mode 100644 index 0c5b1f75b0..0000000000 --- a/packages/babel-plugin-transform-react-jsx/test/fixtures/useSpread/assignment/output.js +++ /dev/null @@ -1,3 +0,0 @@ -var div = /*#__PURE__*/React.createElement(Component, { ...props, - foo: "bar" -}); diff --git a/packages/babel-plugin-transform-react-jsx/test/fixtures/useSpread/options.json b/packages/babel-plugin-transform-react-jsx/test/fixtures/useSpread/options.json deleted file mode 100644 index 7e0d5fcba0..0000000000 --- a/packages/babel-plugin-transform-react-jsx/test/fixtures/useSpread/options.json +++ /dev/null @@ -1,3 +0,0 @@ -{ - "plugins": [["transform-react-jsx", { "useSpread": true }]] -} diff --git a/packages/babel-preset-react/src/index.js b/packages/babel-preset-react/src/index.js index ecb7d3d71a..15a3643d5b 100644 --- a/packages/babel-preset-react/src/index.js +++ b/packages/babel-preset-react/src/index.js @@ -25,21 +25,58 @@ export default declare((api, opts) => { // TODO: (Babel 8) Don't cast this option but validate it const development = !!opts.development; + if (process.env.BABEL_8_BREAKING) { + if ("useSpread" in opts) { + throw new Error( + '@babel/preset-react: Since Babel 8, an inline object with spread elements is always used, and the "useSpread" option is no longer available. Please remove it from your config.', + ); + } + + if ("useBuiltIns" in opts) { + const useBuiltInsFormatted = JSON.stringify(opts.useBuiltIns); + throw new Error( + `@babel/preset-react: Since "useBuiltIns" is removed in Babel 8, you can remove it from the config. +- Babel 8 now transforms JSX spread to object spread. If you need to transpile object spread with +\`useBuiltIns: ${useBuiltInsFormatted}\`, you can use the following config +{ + "plugins": [ + ["@babel/plugin-proposal-object-rest-spread", { "loose": true, "useBuiltIns": ${useBuiltInsFormatted} }] + ], + "presets": ["@babel/preset-react"] +}`, + ); + } + } + + if (typeof development !== "boolean") { + throw new Error( + "@babel/preset-react 'development' option must be a boolean.", + ); + } + return { plugins: [ [ development ? transformReactJSXDevelopment : transformReactJSX, - { - importSource, - pragma, - pragmaFrag, - runtime, - throwIfNamespace, - pure, - // TODO (Babel 8): Remove `useBuiltIns` & `useSpread` - useBuiltIns: !!opts.useBuiltIns, - useSpread: opts.useSpread, - }, + process.env.BABEL_8_BREAKING + ? { + importSource, + pragma, + pragmaFrag, + runtime, + throwIfNamespace, + pure, + } + : { + importSource, + pragma, + pragmaFrag, + runtime, + throwIfNamespace, + pure, + useBuiltIns: !!opts.useBuiltIns, + useSpread: opts.useSpread, + }, ], transformReactDisplayName, pure !== false && transformReactPure,