fix(keep-alive): invoke initial activated hook for async components's…

… child component (vuejs#7276)

packages/runtime-core/__tests__/components/KeepAlive.spec.ts

@@ -883,6 +883,42 @@ describe('KeepAlive', () => {
     expect(serializeInner(root)).toBe('<p>1</p>')
   })
 
+  // #7276
+  test('should invoke onActivated of child on initial mount', async () => {
+    let parentCount = 0
+    let childCount = 0
+    const Child = defineComponent({
+      name: 'Child',
+      setup() {
+        onActivated(() => {
+          childCount++
+        })
+        return () => 'child'
+      }
+    })
+    const Parent = defineComponent({
+      setup() {
+        onActivated(() => {
+          parentCount++
+        })
+        return () => h(Child)
+      }
+    })
+    const AsyncComp = defineAsyncComponent(() => Promise.resolve(Parent))
+
+    const App = {
+      render: () => {
+        return h(KeepAlive, null, () => h(AsyncComp))
+      }
+    }
+
+    render(h(App), root)
+    await timeout()
+    expect(serializeInner(root)).toBe('child')
+    expect(parentCount).toBe(1)
+    expect(childCount).toBe(1)
+  })
+
   // #4976
   test('handle error in async onActivated', async () => {
     const err = new Error('foo')

packages/runtime-core/src/components/KeepAlive.ts

@@ -402,10 +402,18 @@ function registerKeepAliveHook(
   // arrays.
   if (target) {
     let current = target.parent
+    let child = target
     while (current && current.parent) {
       if (isKeepAlive(current.parent.vnode)) {
-        injectToKeepAliveRoot(wrappedHook, type, target, current)
+        injectToKeepAliveRoot(
+          wrappedHook,
+          type,
+          target,
+          // #7276
+          isAsyncWrapper(current) ? child : current
+        )
       }
+      child = current
       current = current.parent
     }
   }