From cfdb517bff6bc059950b703998824411b00bf666 Mon Sep 17 00:00:00 2001
From: rudy-xhd <xuhaodong66@foxmail.com>
Date: Wed, 28 Dec 2022 00:04:07 +0800
Subject: [PATCH] fix(types): component type check when props is an empty
 object

---
 packages/dts-test/defineComponent.test-d.tsx  | 30 +++++++++++++++----
 .../runtime-core/src/apiDefineComponent.ts    |  6 ++--
 2 files changed, 28 insertions(+), 8 deletions(-)

diff --git a/packages/dts-test/defineComponent.test-d.tsx b/packages/dts-test/defineComponent.test-d.tsx
index 0d2e35d7983..a5978b65194 100644
--- a/packages/dts-test/defineComponent.test-d.tsx
+++ b/packages/dts-test/defineComponent.test-d.tsx
@@ -475,6 +475,26 @@ describe('type inference w/ options API', () => {
   })
 })
 
+// #4051
+describe('type inference w/ empty prop object', () => {
+  const MyComponent = defineComponent({
+    props: {},
+    setup(props) {
+      return {}
+    },
+    render() {}
+  })
+  expectType<JSX.Element>(<MyComponent />)
+  // AllowedComponentProps
+  expectType<JSX.Element>(<MyComponent class={'foo'} />)
+  // ComponentCustomProps
+  expectType<JSX.Element>(<MyComponent custom={1} />)
+  // VNodeProps
+  expectType<JSX.Element>(<MyComponent key="1" />)
+  // @ts-expect-error
+  expectError(<MyComponent other="other" />)
+})
+
 describe('with mixins', () => {
   const MixinA = defineComponent({
     emits: ['bar'],
@@ -1040,7 +1060,7 @@ describe('inject', () => {
       expectType<unknown>(this.foo)
       expectType<unknown>(this.bar)
       //  @ts-expect-error
-      this.foobar = 1
+      expectError((this.foobar = 1))
     }
   })
 
@@ -1052,7 +1072,7 @@ describe('inject', () => {
       expectType<unknown>(this.foo)
       expectType<unknown>(this.bar)
       //  @ts-expect-error
-      this.foobar = 1
+      expectError((this.foobar = 1))
     }
   })
 
@@ -1072,7 +1092,7 @@ describe('inject', () => {
       expectType<unknown>(this.foo)
       expectType<unknown>(this.bar)
       //  @ts-expect-error
-      this.foobar = 1
+      expectError((this.foobar = 1))
     }
   })
 
@@ -1081,9 +1101,9 @@ describe('inject', () => {
     props: ['a', 'b'],
     created() {
       //  @ts-expect-error
-      this.foo = 1
+      expectError((this.foo = 1))
       //  @ts-expect-error
-      this.bar = 1
+      expectError((this.bar = 1))
     }
   })
 })
diff --git a/packages/runtime-core/src/apiDefineComponent.ts b/packages/runtime-core/src/apiDefineComponent.ts
index c10ac74e4a9..1f858ccc8fb 100644
--- a/packages/runtime-core/src/apiDefineComponent.ts
+++ b/packages/runtime-core/src/apiDefineComponent.ts
@@ -170,9 +170,9 @@ export function defineComponent<
 export function defineComponent<
   // the Readonly constraint allows TS to treat the type of { required: true }
   // as constant instead of boolean.
-  PropsOptions extends Readonly<ComponentPropsOptions>,
-  RawBindings,
-  D,
+  PropsOptions extends Readonly<ComponentPropsOptions> = {},
+  RawBindings = {},
+  D = {},
   C extends ComputedOptions = {},
   M extends MethodOptions = {},
   Mixin extends ComponentOptionsMixin = ComponentOptionsMixin,