From: leemove <hg_limu@163.com>
Date: Fri, 21 Apr 2023 09:23:02 +0000 (+0800)
Subject: fix(warn): avoid redundant usage warn (#1797)
X-Git-Tag: v4.2.0~16
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=bbd80adb627d4ee3f3e0ef7f7a1f99a2c5e0edf6;p=thirdparty%2Fvuejs%2Frouter.git

fix(warn): avoid redundant usage warn (#1797)

Co-authored-by: leemove <limu.mzm@bytedance.com>
---

diff --git a/packages/router/__tests__/RouterView.spec.ts b/packages/router/__tests__/RouterView.spec.ts
index 4781264a..54fea992 100644
--- a/packages/router/__tests__/RouterView.spec.ts
+++ b/packages/router/__tests__/RouterView.spec.ts
@@ -411,6 +411,32 @@ describe('RouterView', () => {
       expect('can no longer be used directly inside').toHaveBeenWarned()
     })
 
+    it('does not warn if RouterView is not a direct-child of transition', async () => {
+      const route = createMockedRoute(routes.root)
+      mount(
+        {
+          template: `
+        <transition>
+          <div>
+            <router-view/>
+          </div>
+        </transition>
+        `,
+        },
+        {
+          props: {},
+          global: {
+            stubs: {
+              transition: false,
+            },
+            provide: route.provides,
+            components: { RouterView },
+          },
+        }
+      )
+      expect('can no longer be used directly inside').not.toHaveBeenWarned()
+    })
+
     it('warns if Transition wraps a RouterView', () => {
       const route = createMockedRoute(routes.root)
       const wrapper = mount(
diff --git a/packages/router/src/RouterView.ts b/packages/router/src/RouterView.ts
index 4ad60d03..ad4d8f72 100644
--- a/packages/router/src/RouterView.ts
+++ b/packages/router/src/RouterView.ts
@@ -15,6 +15,7 @@ import {
   watch,
   Slot,
   VNode,
+  Component,
 } from 'vue'
 import {
   RouteLocationNormalized,
@@ -240,9 +241,13 @@ export const RouterView = RouterViewImpl as unknown as {
 function warnDeprecatedUsage() {
   const instance = getCurrentInstance()!
   const parentName = instance.parent && instance.parent.type.name
+  const parentSubTreeType =
+    instance.parent && instance.parent.subTree && instance.parent.subTree.type
   if (
     parentName &&
-    (parentName === 'KeepAlive' || parentName.includes('Transition'))
+    (parentName === 'KeepAlive' || parentName.includes('Transition')) &&
+    typeof parentSubTreeType === 'object' &&
+    (parentSubTreeType as Component).name === 'RouterView'
   ) {
     const comp = parentName === 'KeepAlive' ? 'keep-alive' : 'transition'
     warn(