From 7374e93f0281f273b90ab5a6724cc47332a01d6c Mon Sep 17 00:00:00 2001 From: Carlos Rodrigues 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(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 & Omit

- : P & PublicProps - > + $props: MakeDefaultsOptional extends true + ? Partial & Omit & PublicProps, keyof Defaults> + : Prettify

& PublicProps $attrs: Data $refs: Data $slots: UnwrapSlotsType 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