test(defineProps): add intersection type test (#8684)

Co-authored-by: daiwei <[email protected]>
Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com>

Author: 3 people

packages/compiler-sfc/__tests__/compileScript/__snapshots__/defineProps.spec.ts.snap

@@ -233,6 +233,33 @@ export default /*@__PURE__*/_defineComponent({
 
       
     
+return {  }
+}
+
+})"
+`;
+
+exports[`defineProps > w/ extends intersection type 1`] = `
+"import { defineComponent as _defineComponent } from 'vue'
+type Foo = {
+        x?: number;
+      };
+      interface Props extends Foo {
+        z: number
+        y: string
+      }
+      
+export default /*#__PURE__*/_defineComponent({
+  props: {
+    z: { type: Number, required: true },
+    y: { type: String, required: true },
+    x: { type: Number, required: false }
+  },
+  setup(__props: any, { expose: __expose }) {
+  __expose();
+
+      
+    
 return {  }
 }
 
@@ -268,6 +295,31 @@ export default /*@__PURE__*/_defineComponent({
 
     
     
+return {  }
+}
+
+})"
+`;
+
+exports[`defineProps > w/ intersection type 1`] = `
+"import { defineComponent as _defineComponent } from 'vue'
+type Foo = {
+        x?: number;
+      };
+      type Bar = {
+        y: string;
+      };
+      
+export default /*#__PURE__*/_defineComponent({
+  props: {
+    x: { type: Number, required: false },
+    y: { type: String, required: true }
+  },
+  setup(__props: any, { expose: __expose }) {
+  __expose();
+
+      
+    
 return {  }
 }
 

packages/compiler-sfc/__tests__/compileScript/defineProps.spec.ts

@@ -261,6 +261,51 @@ const props = defineProps({ foo: String })
     })
   })
 
+  test('w/ extends intersection type', () => {
+    const { content, bindings } = compile(`
+    <script setup lang="ts">
+      type Foo = {
+        x?: number;
+      };
+      interface Props extends Foo {
+        z: number
+        y: string
+      }
+      defineProps<Props>()
+    </script>
+    `)
+    assertCode(content)
+    expect(content).toMatch(`z: { type: Number, required: true }`)
+    expect(content).toMatch(`y: { type: String, required: true }`)
+    expect(content).toMatch(`x: { type: Number, required: false }`)
+    expect(bindings).toStrictEqual({
+      x: BindingTypes.PROPS,
+      y: BindingTypes.PROPS,
+      z: BindingTypes.PROPS,
+    })
+  })
+
+  test('w/ intersection type', () => {
+    const { content, bindings } = compile(`
+    <script setup lang="ts">
+      type Foo = {
+        x?: number;
+      };
+      type Bar = {
+        y: string;
+      };
+      defineProps<Foo & Bar>()
+    </script>
+    `)
+    assertCode(content)
+    expect(content).toMatch(`y: { type: String, required: true }`)
+    expect(content).toMatch(`x: { type: Number, required: false }`)
+    expect(bindings).toStrictEqual({
+      x: BindingTypes.PROPS,
+      y: BindingTypes.PROPS,
+    })
+  })
+
   test('w/ exported interface', () => {
     const { content, bindings } = compile(`
     <script setup lang="ts">