fix(plugin-react): restore-jsx bug when component name is lowercase (#…

…6110)
vitejs · Dec 16, 2021 · ce65c56 · ce65c56
1 parent 5f39c28
commit ce65c56
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 3 deletions.
diff --git a/packages/plugin-react/src/jsx-runtime/babel-restore-jsx.spec.ts b/packages/plugin-react/src/jsx-runtime/babel-restore-jsx.spec.ts
@@ -108,4 +108,10 @@ describe('babel-restore-jsx', () => {
       )
     ).toMatchInlineSnapshot(`"<h1>{foo ? <p /> : null}</h1>;"`)
   })
+
+  it('should handle lowercase component names', () => {
+    expect(jsx('React.createElement(aaa)')).toMatchInlineSnapshot(
+      `"React.createElement(aaa);"`
+    )
+  })
 })
diff --git a/packages/plugin-react/src/jsx-runtime/babel-restore-jsx.ts b/packages/plugin-react/src/jsx-runtime/babel-restore-jsx.ts
@@ -76,7 +76,7 @@ export default function ({ types: t }: typeof babel): babel.PluginObj {
       return null
     }
 
-    const name = getJSXIdentifier(node)
+    const name = getJSXIdentifier(node, true)
     if (name != null) {
       return name
     }
@@ -152,9 +152,9 @@ export default function ({ types: t }: typeof babel): babel.PluginObj {
     return children
   }
 
-  function getJSXIdentifier(node: any) {
+  function getJSXIdentifier(node: any, tag = false) {
     //TODO: JSXNamespacedName
-    if (t.isIdentifier(node)) {
+    if (t.isIdentifier(node) && (!tag || node.name.match(/^[A-Z]/))) {
       return t.jsxIdentifier(node.name)
     }
     if (t.isStringLiteral(node)) {