From e70ff83e72dc8ae5892bdc20d47f47bc007ca62a Mon Sep 17 00:00:00 2001
From: anhao <117057608+ah-dc@users.noreply.github.com>
Date: Wed, 5 Jul 2023 17:35:45 +0800
Subject: [PATCH] fix(vite): fix issue detecting shadowed keyed composables
 (#21891)

---
 packages/vite/src/plugins/composable-keys.ts  |  4 +--
 packages/vite/test/composable-keys.test.ts    | 27 +++++++++++++++++++
 test/fixtures/basic/nuxt.config.ts            |  2 +-
 .../custom-keyed-composable.ts                |  3 +++
 .../basic/pages/keyed-composables/index.vue   |  3 ++-
 .../basic/pages/keyed-composables/local.vue   |  7 +++--
 6 files changed, 40 insertions(+), 6 deletions(-)
 create mode 100644 packages/vite/test/composable-keys.test.ts
 create mode 100644 test/fixtures/basic/other-composables-folder/custom-keyed-composable.ts

diff --git a/packages/vite/src/plugins/composable-keys.ts b/packages/vite/src/plugins/composable-keys.ts
index 86df9a2659..43cd18b353 100644
--- a/packages/vite/src/plugins/composable-keys.ts
+++ b/packages/vite/src/plugins/composable-keys.ts
@@ -224,7 +224,7 @@ class ScopedVarsCollector {
 
 const NUXT_IMPORT_RE = /nuxt|#app|#imports/
 
-function detectImportNames (code: string, composableMeta: Record<string, { source?: string | RegExp }>) {
+export function detectImportNames (code: string, composableMeta: Record<string, { source?: string | RegExp }>) {
   const imports = findStaticImports(code)
   const names = new Set<string>()
   for (const i of imports) {
@@ -235,7 +235,7 @@ function detectImportNames (code: string, composableMeta: Record<string, { sourc
       if (source && matchWithStringOrRegex(i.specifier, source)) {
         return
       }
-      names.add(namedImports![name])
+      names.add(name)
     }
 
     const { namedImports, defaultImport, namespacedImport } = parseStaticImport(i)
diff --git a/packages/vite/test/composable-keys.test.ts b/packages/vite/test/composable-keys.test.ts
new file mode 100644
index 0000000000..913cacb6c6
--- /dev/null
+++ b/packages/vite/test/composable-keys.test.ts
@@ -0,0 +1,27 @@
+import { describe, expect, it } from 'vitest'
+
+import { detectImportNames } from '../src/plugins/composable-keys'
+
+describe('detectImportNames', () => {
+  const keyedComposables = {
+    useFetch: { source: '#app', argumentLength: 2 },
+    useCustomFetch: { source: 'custom-fetch', argumentLength: 2 }
+  }
+  it('should not include imports from nuxt', () => {
+    expect([...detectImportNames('import { useFetch } from \'#app\'', {})]).toMatchInlineSnapshot('[]')
+    expect([...detectImportNames('import { useFetch } from \'nuxt/app\'', {})]).toMatchInlineSnapshot('[]')
+  })
+  it('should pick up other imports', () => {
+    expect([...detectImportNames('import { useCustomFetch, someThing as someThingRenamed } from \'custom-fetch\'', {})]).toMatchInlineSnapshot(`
+      [
+        "useCustomFetch",
+        "someThingRenamed",
+      ]
+    `)
+    expect([...detectImportNames('import { useCustomFetch, someThing as someThingRenamed } from \'custom-fetch\'', keyedComposables)]).toMatchInlineSnapshot(`
+      [
+        "someThingRenamed",
+      ]
+    `)
+  })
+})
diff --git a/test/fixtures/basic/nuxt.config.ts b/test/fixtures/basic/nuxt.config.ts
index 19f8dfb8b7..5a6d38d138 100644
--- a/test/fixtures/basic/nuxt.config.ts
+++ b/test/fixtures/basic/nuxt.config.ts
@@ -63,7 +63,7 @@ export default defineNuxtConfig({
     keyedComposables: [
       {
         name: 'useCustomKeyedComposable',
-        source: 'pages/keyed-composables/index.vue',
+        source: '~/other-composables-folder/custom-keyed-composable',
         argumentLength: 1
       }
     ]
diff --git a/test/fixtures/basic/other-composables-folder/custom-keyed-composable.ts b/test/fixtures/basic/other-composables-folder/custom-keyed-composable.ts
new file mode 100644
index 0000000000..f149fd3585
--- /dev/null
+++ b/test/fixtures/basic/other-composables-folder/custom-keyed-composable.ts
@@ -0,0 +1,3 @@
+export function useCustomKeyedComposable (arg?: string) {
+  return arg
+}
diff --git a/test/fixtures/basic/pages/keyed-composables/index.vue b/test/fixtures/basic/pages/keyed-composables/index.vue
index e08d87b814..97428b2814 100644
--- a/test/fixtures/basic/pages/keyed-composables/index.vue
+++ b/test/fixtures/basic/pages/keyed-composables/index.vue
@@ -1,4 +1,6 @@
 <script setup lang="ts">
+import { useCustomKeyedComposable } from '~/other-composables-folder/custom-keyed-composable'
+
 const useLocalState = () => useState(() => {
   if (process.client) { console.error('running usestate') }
   return { foo: Math.random() }
@@ -33,7 +35,6 @@ const useLocalLazyFetch = () => useLazyFetch(() => '/api/counter')
 const { data: useLazyFetchTest1 } = await useLocalLazyFetch()
 const { data: useLazyFetchTest2 } = await useLocalLazyFetch()
 
-const useCustomKeyedComposable = (arg?: string) => arg
 const useLocalCustomKeyedComposable = () => useCustomKeyedComposable()
 const useMyAsyncDataTest1 = useLocalCustomKeyedComposable()
 const useMyAsyncDataTest2 = useLocalCustomKeyedComposable()
diff --git a/test/fixtures/basic/pages/keyed-composables/local.vue b/test/fixtures/basic/pages/keyed-composables/local.vue
index 2e1a490c67..7e50cfa7a0 100644
--- a/test/fixtures/basic/pages/keyed-composables/local.vue
+++ b/test/fixtures/basic/pages/keyed-composables/local.vue
@@ -39,9 +39,12 @@ function localScopedComposables () {
     })()]
   }
 
-  return [...basic(), ...hoisting(), ...complex(), ...deeperScope()]
-}
+  function useCustomKeyedComposable (arg?: string) {
+    return _assert(arg)
+  }
 
+  return [...basic(), ...hoisting(), ...complex(), ...deeperScope(), useCustomKeyedComposable()]
+}
 const skippedLocalScopedComposables = localScopedComposables().every(res => res === 'was not keyed')
 </script>