Skip to content
Merged
Show file tree
Hide file tree
Changes from 2 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
162 changes: 162 additions & 0 deletions packages-private/dts-test/vapor/defineVaporCustomElement.test-d.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,162 @@
import {
type VaporElementConstructor,
defineVaporComponent,
defineVaporCustomElement,
} from 'vue'
import { describe, expectType, test } from '../utils'

describe('defineVaporCustomElement using defineVaporComponent return type', () => {
test('with object emits', () => {
const Comp1Vapor = defineVaporComponent({
props: {
a: String,
},
emits: {
click: () => true,
},
})
const Comp = defineVaporCustomElement(Comp1Vapor)
expectType<VaporElementConstructor>(Comp)

const instance = new Comp()
expectType<string | undefined>(instance.a)
instance.a = ''
})

test('with array emits', () => {
const Comp1Vapor = defineVaporComponent({
props: {
a: Number,
},
emits: ['click'],
})
const Comp = defineVaporCustomElement(Comp1Vapor)
expectType<VaporElementConstructor>(Comp)

const instance = new Comp()
expectType<number | undefined>(instance.a)
instance.a = 42
})

test('with required props', () => {
const Comp1Vapor = defineVaporComponent({
props: {
a: { type: Number, required: true },
},
})
const Comp = defineVaporCustomElement(Comp1Vapor)
expectType<VaporElementConstructor>(Comp)

const instance = new Comp()
expectType<number>(instance.a)
instance.a = 42
})

test('with default props', () => {
const Comp1Vapor = defineVaporComponent({
props: {
a: {
type: Number,
default: 1,
validator: () => true,
},
},
emits: ['click'],
})
const Comp = defineVaporCustomElement(Comp1Vapor)
expectType<VaporElementConstructor>(Comp)

const instance = new Comp()
expectType<number>(instance.a)
instance.a = 42
})
})

describe('defineVaporCustomElement with direct setup function', () => {
test('basic setup function', () => {
const Comp = defineVaporCustomElement((props: { msg: string }) => {
expectType<string>(props.msg)
return []
})
expectType<VaporElementConstructor<{ msg: string }>>(Comp)

const instance = new Comp()
expectType<string>(instance.msg)
})

test('setup function with emits', () => {
const Comp = defineVaporCustomElement(
(props: { msg: string }, ctx) => {
ctx.emit('foo')
return []
},
{
emits: ['foo'],
},
)
expectType<VaporElementConstructor<{ msg: string }>>(Comp)

const instance = new Comp()
expectType<string>(instance.msg)
})
})

describe('defineVaporCustomElement with options object', () => {
test('with object props', () => {
const Comp = defineVaporCustomElement({
props: {
foo: String,
bar: {
type: Number,
required: true,
},
},
setup(props) {
expectType<string | undefined>(props.foo)
expectType<number>(props.bar)
},
})
expectType<VaporElementConstructor>(Comp)

const instance = new Comp()
expectType<string | undefined>(instance.foo)
expectType<number>(instance.bar)
})

test('with array props', () => {
const Comp = defineVaporCustomElement({
props: ['foo', 'bar'],
setup(props) {
expectType<any>(props.foo)
expectType<any>(props.bar)
},
})
expectType<VaporElementConstructor>(Comp)

const instance = new Comp()
expectType<any>(instance.foo)
expectType<any>(instance.bar)
})

test('with emits', () => {
const Comp = defineVaporCustomElement({
props: {
value: String,
},
emits: {
change: (val: string) => true,
},
setup(props, { emit }) {
emit('change', 'test')
// @ts-expect-error
emit('change', 123)
// @ts-expect-error
emit('unknown')
},
})
expectType<VaporElementConstructor>(Comp)

const instance = new Comp()
expectType<string | undefined>(instance.value)
})
})
Loading
Loading