* test: add test case for declaring Array prop type with constructor casting in `createComponent`
* test: add test case for `setup(props)` with explicit props declaration
},
setup() {
// resolve in setup
- const FooBar = resolveDirective('foo-bar') as any
+ const FooBar = resolveDirective('foo-bar')!
return () => {
// resolve in render
- const BarBaz = resolveDirective('bar-baz') as any
+ const BarBaz = resolveDirective('bar-baz')!
return applyDirectives(h('div'), [[FooBar], [BarBaz]])
}
}
default: 'hello'
},
// explicit type casting
- cc: (Array as any) as PropType<string[]>,
+ cc: Array as PropType<string[]>,
// required + type casting
dd: {
- type: (Array as any) as PropType<string[]>,
+ type: Array as PropType<string[]>,
+ required: true
+ },
+ // explicit type casting with constructor
+ ccc: Array as () => string[],
+ // required + contructor type casting
+ ddd: {
+ type: Array as () => string[],
required: true
}
} as const, // required to narrow for conditional check
}
})
// test TSX props inference
- ;(<MyComponent a={1} b="foo" dd={['foo']}/>)
+ ;(<MyComponent a={1} b="foo" dd={['foo']} ddd={['foo']}/>)
})
test('type inference w/ optional props declaration', () => {
expect(dummy).toBe(1)
})
+ it('setup props should resolve the correct types from props object', async () => {
+ const count = ref(0)
+ let dummy
+
+ const Parent = {
+ render: () => h(Child, { count: count.value })
+ }
+
+ const Child = createComponent({
+ props: {
+ count: Number
+ },
+
+ setup(props) {
+ watch(() => {
+ dummy = props.count
+ })
+ return () => h('div', props.count)
+ }
+ })
+
+ const root = nodeOps.createElement('div')
+ render(h(Parent), root)
+ expect(serializeInner(root)).toMatch(`<div>0</div>`)
+ expect(dummy).toBe(0)
+
+ // props should be reactive
+ count.value++
+ await nextTick()
+ expect(serializeInner(root)).toMatch(`<div>1</div>`)
+ expect(dummy).toBe(1)
+ })
+
it('context.attrs', async () => {
const toggle = ref(true)
const Comp = {
setup() {
- const error = ref<any>(null)
+ const error = ref<Error | null>(null)
onErrorCaptured(e => {
error.value = e
return true