fix(ssr): handle class declaration and expression name scoping (#16569)

bluwy · web-flow · commit c071eb38221b · 2024-05-02T00:56:28.000+09:00
diff --git a/packages/vite/src/node/ssr/__tests__/ssrTransform.spec.ts b/packages/vite/src/node/ssr/__tests__/ssrTransform.spec.ts
@@ -271,6 +271,37 @@ test('do not rewrite when function expression is in global scope', async () => {
   `)
 })
 
+test('do not rewrite when class declaration is in scope', async () => {
+  const result = await ssrTransformSimple(
+    `import { cls } from 'vue';function A(){ class cls {} return { cls }; }`,
+  )
+  expect(result?.code).toMatchInlineSnapshot(`
+    "const __vite_ssr_import_0__ = await __vite_ssr_import__("vue", {"importedNames":["cls"]});
+    function A(){ class cls {} return { cls }; }"
+  `)
+  expect(result?.deps).toEqual(['vue'])
+})
+
+test('do not rewrite when class expression is in scope', async () => {
+  const result = await ssrTransformSimple(
+    `import { cls } from './vue';var a = function() { return class cls { constructor() { console.log(cls) } } }`,
+  )
+  expect(result?.code).toMatchInlineSnapshot(`
+    "const __vite_ssr_import_0__ = await __vite_ssr_import__("./vue", {"importedNames":["cls"]});
+    var a = function() { return class cls { constructor() { console.log(cls) } } }"
+  `)
+})
+
+test('do not rewrite when class expression is in global scope', async () => {
+  const result = await ssrTransformSimple(
+    `import { cls } from './vue';foo(class cls { constructor() { console.log(cls) } })`,
+  )
+  expect(result?.code).toMatchInlineSnapshot(`
+    "const __vite_ssr_import_0__ = await __vite_ssr_import__("./vue", {"importedNames":["cls"]});
+    foo(class cls { constructor() { console.log(cls) } })"
+  `)
+})
+
 test('do not rewrite catch clause', async () => {
   const result = await ssrTransformSimple(
     `import {error} from './dependency';try {} catch(error) {}`,
diff --git a/packages/vite/src/node/ssr/ssrTransform.ts b/packages/vite/src/node/ssr/ssrTransform.ts
@@ -439,7 +439,7 @@ function walk(
         if (node.type === 'FunctionDeclaration') {
           const parentScope = findParentScope(parentStack)
           if (parentScope) {
-            setScope(parentScope, node.id!.name)
+            setScope(parentScope, node.id.name)
           }
         }
         // If it is a function expression, its name (if exist) could also be
@@ -479,6 +479,15 @@ function walk(
             },
           })
         })
+      } else if (node.type === 'ClassDeclaration') {
+        // A class declaration name could shadow an import, so add its name to the parent scope
+        const parentScope = findParentScope(parentStack)
+        if (parentScope) {
+          setScope(parentScope, node.id.name)
+        }
+      } else if (node.type === 'ClassExpression' && node.id) {
+        // A class expression name could shadow an import, so add its name to the scope
+        setScope(node, node.id.name)
       } else if (node.type === 'Property' && parent!.type === 'ObjectPattern') {
         // mark property in destructuring pattern
         setIsNodeInPattern(node)
