return type of scopedSlots.foo({}) doesn't match the return type of render() in functional components

[jacekkarczmarczyk]

Version

2.6.10

Reproduction link

https://jsfiddle.net/1yonhcvb/

Steps to reproduce

import Vue, { VNode } from 'vue';

// Works
Vue.extend({
  functional: true,
  render: (h, { scopedSlots }) => scopedSlots.default({}) as VNode[],
});

// Doesn't work
Vue.extend({
  functional: true,
  render: (h, { scopedSlots }) => scopedSlots.default({}),
});

What is expected?

I should be able to return scoped slot without casting

What is actually happening?

I need to cast scoped slot return value to VNode[], otherwise it results in TS error:

Argument of type '{ functional: boolean; render: (h: CreateElement, { scopedSlots }: RenderContext<Record<never, any>>) => ScopedSlotChildren; }' is not assignable to parameter of type 'ComponentOptions<Vue, DefaultData<Vue>, DefaultMethods<Vue>, DefaultComputed, PropsDefinition<Record<string, any>>, Record<string, any>>'.
  Object literal may only specify known properties, and 'functional' does not exist in type 'ComponentOptions<Vue, DefaultData<Vue>, DefaultMethods<Vue>, DefaultComputed, PropsDefinition<Record<string, any>>, Record<string, any>>'.ts(2345)

---

Might be related to #9372

[posva]

Since the scopedSlots can return undefined, you need to guard against that:

const Testy: FunctionalComponentOptions = {
  functional: true,
  render: (h, { scopedSlots }) => scopedSlots.default({}) || h(),
}

Vue.extend({
  functional: true,
  render: (h, { scopedSlots }) => scopedSlots.default({}) || h(),
})

[jacekkarczmarczyk]

Thank you