From 03ae3006e1e678ade4377cd10d206e8f7b4ad0cb Mon Sep 17 00:00:00 2001
From: Guillaume Chau <guillaume.b.chau@gmail.com>
Date: Fri, 23 Apr 2021 16:52:28 +0200
Subject: [PATCH] feat(devtools): improved KeepAlive support

This change allows the devtools to access the cached vnodes from the KeepAlive component in order to display them as inactive in the components tree
---
 packages/runtime-core/src/components/KeepAlive.ts | 15 +++++++++++++++
 1 file changed, 15 insertions(+)

diff --git a/packages/runtime-core/src/components/KeepAlive.ts b/packages/runtime-core/src/components/KeepAlive.ts
index cbba10fd755..37836c5855e 100644
--- a/packages/runtime-core/src/components/KeepAlive.ts
+++ b/packages/runtime-core/src/components/KeepAlive.ts
@@ -34,6 +34,7 @@ import {
 } from '../renderer'
 import { setTransitionHooks } from './BaseTransition'
 import { ComponentRenderContext } from '../componentPublicInstance'
+import { devtoolsComponentAdded } from '../devtools'
 
 type MatchPattern = string | RegExp | string[] | RegExp[]
 
@@ -95,6 +96,10 @@ const KeepAliveImpl = {
     const keys: Keys = new Set()
     let current: VNode | null = null
 
+    if (__DEV__ || __FEATURE_PROD_DEVTOOLS__) {
+      ;(instance as any).__v_cache = cache
+    }
+
     const parentSuspense = instance.suspense
 
     const {
@@ -132,6 +137,11 @@ const KeepAliveImpl = {
           invokeVNodeHook(vnodeHook, instance.parent, vnode)
         }
       }, parentSuspense)
+
+      if (__DEV__ || __FEATURE_PROD_DEVTOOLS__) {
+        // Update components tree
+        devtoolsComponentAdded(instance)
+      }
     }
 
     sharedContext.deactivate = (vnode: VNode) => {
@@ -147,6 +157,11 @@ const KeepAliveImpl = {
         }
         instance.isDeactivated = true
       }, parentSuspense)
+
+      if (__DEV__ || __FEATURE_PROD_DEVTOOLS__) {
+        // Update components tree
+        devtoolsComponentAdded(instance)
+      }
     }
 
     function unmount(vnode: VNode) {