fix(runtime-core): check extends render when convertLegacyRenderFn (#6860)

packages/runtime-core/src/compat/renderFn.ts

@@ -38,12 +38,15 @@ import {
   isCompatEnabled,
 } from './compatConfig'
 import { compatModelEventPrefix } from './componentVModel'
+import { resolveMergedOptions } from '../componentOptions'
 
 export function convertLegacyRenderFn(
   instance: ComponentInternalInstance,
 ): void {
   const Component = instance.type as ComponentOptions
-  const render = Component.render as InternalRenderFunction | undefined
+  const render = (Component.render || resolveMergedOptions(instance).render) as
+    | InternalRenderFunction
+    | undefined
 
   // v3 runtime compiled, or already checked / wrapped
   if (!render || render._rc || render._compatChecked || render._compatWrapped) {

packages/vue-compat/__tests__/renderFn.spec.ts

@@ -252,4 +252,20 @@ describe('compat: render function', () => {
     expect(vm.$el).toBeInstanceOf(HTMLDivElement)
     expect(vm.$el.outerHTML).toBe(`<div>hello</div>`)
   })
+
+  test('extends render fn', () => {
+    const BaseComponent = {
+      render: (h: any) => h('div', null, ['hello']),
+    }
+    const ExtendComponent = {
+      extends: BaseComponent,
+    }
+    const vm = new Vue({
+      components: { ExtendComponent },
+      render(h: any) {
+        return h('extend-component', null, [])
+      },
+    }).$mount()
+    expect(vm.$el.outerHTML).toBe(`<div>hello</div>`)
+  })
 })