💻

• Would you like to work on a fix?

How are you using Babel?

Programmatic API (babel.transform, babel.parse)

Input code

// Make sure not to use a jsx pragma here (like "@jsx Something"), we need this to be React.createElement!
<blah/>

Configuration file name

No response

Configuration

N/A

Current and expected behavior

Currently, the above will actually generate this code:

Something"),("blah", null);

But, even if ignore the syntax error, it seems to me that JSX pragmas should be a bit stricter as to what they match.For example, if we just add the ^ and $ operators to the current RegExp:

/\*?\s*@jsx\s+([^\s]+)/

becomes:

/\^*?\s*@jsx\s+([^\s]+)$/

Then this would lead to jsx pragmas only being allowed if they are the only content in the comment. This seems to me to be more in the spirit of the intent.

In many ways, the current RegExp is a bit nonsensical just in its construction: *?\s* with no ^ is a completely useless pattern, since the entire sequence is optional and there's nothing preceding it. That's why something like "francisco@jsx hi'' is matched.

BTW, I actually ran into this myself, which is why I am filing this. It's annoying that one's first inclination to "escape" the jsx pragma (by doing something like \@jsx blah) doesn't work either, for the same reason "francisco@jsx hi" is matched.

Environment

N/A

Possible solution

Changing

/\*?\s*@jsx\s+([^\s]+)/

to

/\^*?\s*@jsx\s+([^\s]+)$/

And making the equivalent change for JSX fragments.

Additional context

No response