From 7374e93f0281f273b90ab5a6724cc47332a01d6c Mon Sep 17 00:00:00 2001
From: Carlos Rodrigues <carlos@hypermob.co.uk>
Date: Tue, 24 Oct 2023 11:42:47 +0100
Subject: [PATCH] fix(types): fix ComponentCustomProps augmentation (#9468)

close #8376
---
 packages/dts-built-test/README.md                 |  5 +++++
 packages/dts-built-test/package.json              | 11 +++++++++++
 packages/dts-built-test/src/index.ts              | 12 ++++++++++++
 packages/dts-test/built.test-d.ts                 | 13 +++++++++++++
 packages/dts-test/package.json                    |  3 ++-
 .../runtime-core/src/componentPublicInstance.ts   |  8 +++-----
 pnpm-lock.yaml                                    | 15 +++++++++++++++
 7 files changed, 61 insertions(+), 6 deletions(-)
 create mode 100644 packages/dts-built-test/README.md
 create mode 100644 packages/dts-built-test/package.json
 create mode 100644 packages/dts-built-test/src/index.ts
 create mode 100644 packages/dts-test/built.test-d.ts

diff --git a/packages/dts-built-test/README.md b/packages/dts-built-test/README.md
new file mode 100644
index 00000000000..8191d66e32e
--- /dev/null
+++ b/packages/dts-built-test/README.md
@@ -0,0 +1,5 @@
+# dts built-package test
+
+This package is private and for testing only. It is used to verify edge cases for external libraries that build their types using Vue core types - e.g. Vuetify as in [#8376](https://github.com/vuejs/core/issues/8376).
+
+When running the `build-dts` task, this package's types are built alongside other packages. Then, during `test-dts-only` it is imported and used in [`packages/dts-test/built.test-d.ts`](https://github.com/vuejs/core/blob/main/packages/dts-test/built.test-d.ts) to verify that the built types work correctly.
diff --git a/packages/dts-built-test/package.json b/packages/dts-built-test/package.json
new file mode 100644
index 00000000000..bde52fde206
--- /dev/null
+++ b/packages/dts-built-test/package.json
@@ -0,0 +1,11 @@
+{
+  "name": "@vue/dts-built-test",
+  "private": true,
+  "types": "dist/dts-built-test.d.ts",
+  "dependencies": {
+    "@vue/shared": "workspace:*",
+    "@vue/reactivity": "workspace:*",
+    "vue": "workspace:*"
+  },
+  "version": "3.3.6"
+}
diff --git a/packages/dts-built-test/src/index.ts b/packages/dts-built-test/src/index.ts
new file mode 100644
index 00000000000..2d9d4033254
--- /dev/null
+++ b/packages/dts-built-test/src/index.ts
@@ -0,0 +1,12 @@
+import { defineComponent } from 'vue'
+
+const _CustomPropsNotErased = defineComponent({
+  props: {},
+  setup() {}
+})
+
+// #8376
+export const CustomPropsNotErased =
+  _CustomPropsNotErased as typeof _CustomPropsNotErased & {
+    foo: string
+  }
diff --git a/packages/dts-test/built.test-d.ts b/packages/dts-test/built.test-d.ts
new file mode 100644
index 00000000000..8ac3e333f99
--- /dev/null
+++ b/packages/dts-test/built.test-d.ts
@@ -0,0 +1,13 @@
+import { CustomPropsNotErased } from '@vue/dts-built-test'
+import { expectType, describe } from './utils'
+
+declare module 'vue' {
+  interface ComponentCustomProps {
+    custom?: number
+  }
+}
+
+// #8376 - custom props should not be erased
+describe('Custom Props not erased', () => {
+  expectType<number | undefined>(new CustomPropsNotErased().$props.custom)
+})
diff --git a/packages/dts-test/package.json b/packages/dts-test/package.json
index da8424e254c..c787e620df2 100644
--- a/packages/dts-test/package.json
+++ b/packages/dts-test/package.json
@@ -2,7 +2,8 @@
   "name": "dts-test",
   "private": true,
   "dependencies": {
-    "vue": "workspace:*"
+    "vue": "workspace:*",
+    "@vue/dts-built-test": "workspace:*"
   },
   "version": "3.3.6"
 }
diff --git a/packages/runtime-core/src/componentPublicInstance.ts b/packages/runtime-core/src/componentPublicInstance.ts
index dc575aafff9..b7ef1e07302 100644
--- a/packages/runtime-core/src/componentPublicInstance.ts
+++ b/packages/runtime-core/src/componentPublicInstance.ts
@@ -206,11 +206,9 @@ export type ComponentPublicInstance<
 > = {
   $: ComponentInternalInstance
   $data: D
-  $props: Prettify<
-    MakeDefaultsOptional extends true
-      ? Partial<Defaults> & Omit<P & PublicProps, keyof Defaults>
-      : P & PublicProps
-  >
+  $props: MakeDefaultsOptional extends true
+    ? Partial<Defaults> & Omit<Prettify<P> & PublicProps, keyof Defaults>
+    : Prettify<P> & PublicProps
   $attrs: Data
   $refs: Data
   $slots: UnwrapSlotsType<S>
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 1fd85d6d906..a0fec04e513 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -257,8 +257,23 @@ importers:
         specifier: 3.3.6
         version: link:../shared
 
+  packages/dts-built-test:
+    dependencies:
+      '@vue/reactivity':
+        specifier: workspace:*
+        version: link:../reactivity
+      '@vue/shared':
+        specifier: workspace:*
+        version: link:../shared
+      vue:
+        specifier: workspace:*
+        version: link:../vue
+
   packages/dts-test:
     dependencies:
+      '@vue/dts-built-test':
+        specifier: workspace:*
+        version: link:../dts-built-test
       vue:
         specifier: workspace:*
         version: link:../vue