Skip to content

Commit

Permalink
fix(plugin-react): fix React is not defined when component name is lo…
Browse files Browse the repository at this point in the history
…wercase

add test
  • Loading branch information
yulong.xiang committed Feb 10, 2022
1 parent 5c9c812 commit 98d55e6
Show file tree
Hide file tree
Showing 2 changed files with 57 additions and 1 deletion.
55 changes: 55 additions & 0 deletions packages/plugin-react/src/jsx-runtime/restore-jsx.spec.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,55 @@
import { restoreJSX } from './restore-jsx'
import * as babel from '@babel/core'

async function jsx(sourceCode: string) {
const [ast] = await restoreJSX(babel, sourceCode, 'test.js')
if (ast === null) {
return ast
}
const { code } = await babel.transformFromAstAsync(ast, null, {
configFile: false
})
return code
}
// jsx(`import React__default, { PureComponent, Component, forwardRef, memo, createElement } from 'react';
// React__default.createElement(Foo)`)
// Tests adapted from: https://github.com/flying-sheep/babel-plugin-transform-react-createelement-to-jsx/blob/63137b6/test/index.js
describe('restore-jsx', () => {
it('should trans to ', async () => {
expect(
await jsx(`import React__default, { PureComponent, Component, forwardRef, memo, createElement } from 'react';
React__default.createElement(foo)`)
).toBeNull()
expect(
await jsx(`import React__default, { PureComponent, Component, forwardRef, memo, createElement } from 'react';
React__default.createElement("h1")`)
).toMatch(`<h1 />;`)
expect(
await jsx(`import React__default, { PureComponent, Component, forwardRef, memo, createElement } from 'react';
React__default.createElement(Foo)`)
).toMatch(`<Foo />;`)
expect(
await jsx(`import React__default, { PureComponent, Component, forwardRef, memo, createElement } from 'react';
React__default.createElement(Foo.Bar)`)
).toMatch(`<Foo.Bar />;`)
expect(
await jsx(`import React__default, { PureComponent, Component, forwardRef, memo, createElement } from 'react';
React__default.createElement(Foo.Bar.Baz)`)
).toMatch(`<Foo.Bar.Baz />;`)
})

it('should handle props', async () => {
expect(
await jsx(`import React__default, { PureComponent, Component, forwardRef, memo, createElement } from 'react';
React__default.createElement(foo, {hi: there})`)
).toBeNull()
expect(
await jsx(`import React__default, { PureComponent, Component, forwardRef, memo, createElement } from 'react';
React__default.createElement("h1", {hi: there})`)
).toMatch(`<h1 hi={there} />;`)
expect(
await jsx(`import React__default, { PureComponent, Component, forwardRef, memo, createElement } from 'react';
React__default.createElement(Foo, {hi: there})`)
).toMatch(`<Foo hi={there} />;`)
})
})
3 changes: 2 additions & 1 deletion packages/plugin-react/src/jsx-runtime/restore-jsx.ts
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,7 @@ export async function restoreJSX(
}

const [reactAlias, isCommonJS] = parseReactAlias(code)

if (!reactAlias) {
return jsxNotFound
}
Expand All @@ -29,7 +30,7 @@ export async function restoreJSX(
'g'
)
const reactJsxCreatElementRE = new RegExp(
'\\b' + reactAlias + '\\.(createElement)\\b(\\([A-Z]\\w)',
'\\b' + reactAlias + '\\.(createElement)\\b(\\([A-Z"]\\w)',
'g'
)

Expand Down

0 comments on commit 98d55e6

Please sign in to comment.