From 8f9c62423a1b5c127579559fc65fca4b5c393dac Mon Sep 17 00:00:00 2001
From: edison <daiwei521@126.com>
Date: Mon, 11 Nov 2024 09:05:06 +0800
Subject: [PATCH] fix(hmr): re-resolve script after type dep changed (#446)

---
 packages/plugin-vue/src/index.ts     |  9 +++++++--
 playground/vue/Main.vue              |  2 ++
 playground/vue/TypePropsTsx.vue      | 10 ++++++++++
 playground/vue/__tests__/vue.spec.ts | 14 ++++++++++++++
 4 files changed, 33 insertions(+), 2 deletions(-)
 create mode 100644 playground/vue/TypePropsTsx.vue

diff --git a/packages/plugin-vue/src/index.ts b/packages/plugin-vue/src/index.ts
index 2ac6d5b8..3d547040 100644
--- a/packages/plugin-vue/src/index.ts
+++ b/packages/plugin-vue/src/index.ts
@@ -19,7 +19,7 @@ import {
   getSrcDescriptor,
   getTempSrcDescriptor,
 } from './utils/descriptorCache'
-import { clearScriptCache, getResolvedScript, typeDepToSFCMap } from './script'
+import { clearScriptCache, resolveScript, typeDepToSFCMap } from './script'
 import { transformMain } from './main'
 import { handleHotUpdate, handleTypeDepChange } from './handleHotUpdate'
 import { transformTemplateAsModule } from './template'
@@ -300,7 +300,12 @@ export default function vuePlugin(rawOptions: Options = {}): Plugin<Api> {
         let block: SFCBlock | null | undefined
         if (query.type === 'script') {
           // handle <script> + <script setup> merge via compileScript()
-          block = getResolvedScript(descriptor, ssr)
+          block = resolveScript(
+            descriptor,
+            options.value,
+            ssr,
+            customElementFilter.value(filename),
+          )
         } else if (query.type === 'template') {
           block = descriptor.template!
         } else if (query.type === 'style') {
diff --git a/playground/vue/Main.vue b/playground/vue/Main.vue
index b29ae881..1e15285f 100644
--- a/playground/vue/Main.vue
+++ b/playground/vue/Main.vue
@@ -10,6 +10,7 @@
   </div>
   <HmrCircularReference name="test" />
   <TypeProps msg="msg" bar="bar" :id="123" />
+  <TypePropsTsx msg="msg" bar="bar" />
   <Syntax />
   <PreProcessors />
   <PreProcessorsHmr />
@@ -56,6 +57,7 @@ import WorkerTest from './worker.vue'
 import { ref } from 'vue'
 import Url from './Url.vue'
 import TypeProps from './TypeProps.vue'
+import TypePropsTsx from './TypePropsTsx.vue'
 import DefaultLangs from './DefaultLangs.vue'
 import PreCompiled from './pre-compiled/foo.vue'
 import PreCompiledExternalScoped from './pre-compiled/external-scoped.vue'
diff --git a/playground/vue/TypePropsTsx.vue b/playground/vue/TypePropsTsx.vue
new file mode 100644
index 00000000..9741587f
--- /dev/null
+++ b/playground/vue/TypePropsTsx.vue
@@ -0,0 +1,10 @@
+<script setup lang="tsx">
+import type { Props } from './types'
+
+const props = defineProps<Props & { bar: string }>()
+</script>
+
+<template>
+  <h2>Imported Type Props</h2>
+  <pre class="type-props-tsx">{{ props }}</pre>
+</template>
diff --git a/playground/vue/__tests__/vue.spec.ts b/playground/vue/__tests__/vue.spec.ts
index aa88ec19..eb0af361 100644
--- a/playground/vue/__tests__/vue.spec.ts
+++ b/playground/vue/__tests__/vue.spec.ts
@@ -349,6 +349,20 @@ describe('macro imported types', () => {
       ),
     )
   })
+
+  test('should hmr with lang=tsx', async () => {
+    editFile('types.ts', (code) => code.replace('msg: string', ''))
+    await untilUpdated(
+      () => page.textContent('.type-props-tsx'),
+      JSON.stringify(
+        {
+          bar: 'bar',
+        },
+        null,
+        2,
+      ),
+    )
+  })
 })
 
 test('TS with generics', async () => {