babel-plugin-transform-react-jsx should use the default pragmaFrag if one isn't specified

Bug Report

• I would like to work on a fix!

Current Behavior I’m getting the following error when compiling mdx files that contain a React.Fragment as <></>

transform-react-jsx: pragma has been set but pragmaFrag has not been set

The issue is because mdx is only specifying a jsx pragma, but not a jsxFrag pragma:

See issues opened up in the mdx repos:

• mdx: https://github.com/mdx-js/mdx/issues/990
• gatsby-plugin-mdx: https://github.com/gatsbyjs/gatsby/issues/22500

Expected behavior/code The jsxFrag should default to React.Fragment if one isn’t specified even if a custom jsxFrag is specified.

Environment @babel/plugin-transform-react-jsx@^7.9.1

Possible Solution

If this is expected behavior feel free to close this issue and I can work with the mdx-js team to get a jsxFrag specified in their code, but I’m curious if it would also make sense to loosen the error check seen here: https://github.com/babel/babel/blob/87b27810461d0c475731d8121d887b23ec36c6b6/packages/babel-plugin-transform-react-jsx/src/transform-classic.js#L81-L90 so that if a jsxFrag isn’t set it uses the default React.Fragment with the custom jsx pragma?

[nicolo-ribaudo]

When using @babel/plugin-transform-react-jsx, if you set @jsx and use <></>, then setting @jsxFrag has been required since fragments where implemented in Babel: https://github.com/babel/babel/pull/6552/files#diff-18da325252fa9074bd50f8b406413a01R69-R80.

This is because React.Fragment is not a good default if you are not using React.createElement. What if you are using, for example, Preact? Or if you are not importing React directly because you are using a wrapper around it? The error was introduced on purpose. However, due to a bug in @babel/preset-react, we actually used React.Fragment: this bug error will be re-introduced in Babel 8.

You might have recently noticed this error because, due to a bug in 7.9.0, we threw if the pragmaFrag option of the JSX plugin was set to React.Fragment. Since @babel/preset-react (wrongly) passes the pragmaFrag: "React.Fragment" option as a default value to the plugin, the plugin threw an error. This has been fixed in 7.9.1.

[nicolo-ribaudo]

@loganmccaul Sorry I got confused. We are not currently setting the default pragmaFrag when using the preset, but we’ll set the default again in the next patch. We will then remove it in Babel 8.