Skip to content

Commit fa096b0

Browse files
committed
feat(runtime-vapor): implement defineVaporCustomElement type inference
1 parent ed2afd2 commit fa096b0

File tree

4 files changed

+400
-109
lines changed

4 files changed

+400
-109
lines changed
Lines changed: 162 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,162 @@
1+
import {
2+
type VaporElementConstructor,
3+
defineVaporComponent,
4+
defineVaporCustomElement,
5+
} from 'vue'
6+
import { describe, expectType, test } from '../utils'
7+
8+
describe('defineVaporCustomElement using defineVaporComponent return type', () => {
9+
test('with object emits', () => {
10+
const Comp1Vapor = defineVaporComponent({
11+
props: {
12+
a: String,
13+
},
14+
emits: {
15+
click: () => true,
16+
},
17+
})
18+
const Comp = defineVaporCustomElement(Comp1Vapor)
19+
expectType<VaporElementConstructor>(Comp)
20+
21+
const instance = new Comp()
22+
expectType<string | undefined>(instance.a)
23+
instance.a = ''
24+
})
25+
26+
test('with array emits', () => {
27+
const Comp1Vapor = defineVaporComponent({
28+
props: {
29+
a: Number,
30+
},
31+
emits: ['click'],
32+
})
33+
const Comp = defineVaporCustomElement(Comp1Vapor)
34+
expectType<VaporElementConstructor>(Comp)
35+
36+
const instance = new Comp()
37+
expectType<number | undefined>(instance.a)
38+
instance.a = 42
39+
})
40+
41+
test('with required props', () => {
42+
const Comp1Vapor = defineVaporComponent({
43+
props: {
44+
a: { type: Number, required: true },
45+
},
46+
})
47+
const Comp = defineVaporCustomElement(Comp1Vapor)
48+
expectType<VaporElementConstructor>(Comp)
49+
50+
const instance = new Comp()
51+
expectType<number>(instance.a)
52+
instance.a = 42
53+
})
54+
55+
test('with default props', () => {
56+
const Comp1Vapor = defineVaporComponent({
57+
props: {
58+
a: {
59+
type: Number,
60+
default: 1,
61+
validator: () => true,
62+
},
63+
},
64+
emits: ['click'],
65+
})
66+
const Comp = defineVaporCustomElement(Comp1Vapor)
67+
expectType<VaporElementConstructor>(Comp)
68+
69+
const instance = new Comp()
70+
expectType<number>(instance.a)
71+
instance.a = 42
72+
})
73+
})
74+
75+
describe('defineVaporCustomElement with direct setup function', () => {
76+
test('basic setup function', () => {
77+
const Comp = defineVaporCustomElement((props: { msg: string }) => {
78+
expectType<string>(props.msg)
79+
return []
80+
})
81+
expectType<VaporElementConstructor<{ msg: string }>>(Comp)
82+
83+
const instance = new Comp()
84+
expectType<string>(instance.msg)
85+
})
86+
87+
test('setup function with emits', () => {
88+
const Comp = defineVaporCustomElement(
89+
(props: { msg: string }, ctx) => {
90+
ctx.emit('foo')
91+
return []
92+
},
93+
{
94+
emits: ['foo'],
95+
},
96+
)
97+
expectType<VaporElementConstructor<{ msg: string }>>(Comp)
98+
99+
const instance = new Comp()
100+
expectType<string>(instance.msg)
101+
})
102+
})
103+
104+
describe('defineVaporCustomElement with options object', () => {
105+
test('with object props', () => {
106+
const Comp = defineVaporCustomElement({
107+
props: {
108+
foo: String,
109+
bar: {
110+
type: Number,
111+
required: true,
112+
},
113+
},
114+
setup(props) {
115+
expectType<string | undefined>(props.foo)
116+
expectType<number>(props.bar)
117+
},
118+
})
119+
expectType<VaporElementConstructor>(Comp)
120+
121+
const instance = new Comp()
122+
expectType<string | undefined>(instance.foo)
123+
expectType<number>(instance.bar)
124+
})
125+
126+
test('with array props', () => {
127+
const Comp = defineVaporCustomElement({
128+
props: ['foo', 'bar'],
129+
setup(props) {
130+
expectType<any>(props.foo)
131+
expectType<any>(props.bar)
132+
},
133+
})
134+
expectType<VaporElementConstructor>(Comp)
135+
136+
const instance = new Comp()
137+
expectType<any>(instance.foo)
138+
expectType<any>(instance.bar)
139+
})
140+
141+
test('with emits', () => {
142+
const Comp = defineVaporCustomElement({
143+
props: {
144+
value: String,
145+
},
146+
emits: {
147+
change: (val: string) => true,
148+
},
149+
setup(props, { emit }) {
150+
emit('change', 'test')
151+
// @ts-expect-error
152+
emit('change', 123)
153+
// @ts-expect-error
154+
emit('unknown')
155+
},
156+
})
157+
expectType<VaporElementConstructor>(Comp)
158+
159+
const instance = new Comp()
160+
expectType<string | undefined>(instance.value)
161+
})
162+
})

0 commit comments

Comments
 (0)