From 52d75c086ff62b64d05a2130f8e7c8ac0885fe9c Mon Sep 17 00:00:00 2001
From: daiwei <daiwei521@126.com>
Date: Wed, 6 Oct 2021 22:50:17 +0800
Subject: [PATCH 1/2] fix(BaseTransition): avoid flat children if fragment is
 stable and keyed

---
 .../src/components/BaseTransition.ts             | 10 +++++++---
 packages/vue/__tests__/TransitionGroup.spec.ts   | 16 ++++++++++++++++
 2 files changed, 23 insertions(+), 3 deletions(-)

diff --git a/packages/runtime-core/src/components/BaseTransition.ts b/packages/runtime-core/src/components/BaseTransition.ts
index cb628bf655a..6c4d012fb32 100644
--- a/packages/runtime-core/src/components/BaseTransition.ts
+++ b/packages/runtime-core/src/components/BaseTransition.ts
@@ -465,9 +465,13 @@ export function getTransitionRawChildren(
     // handle fragment children case, e.g. v-for
     if (child.type === Fragment) {
       if (child.patchFlag & PatchFlags.KEYED_FRAGMENT) keyedFragmentCount++
-      ret = ret.concat(
-        getTransitionRawChildren(child.children as VNode[], keepComment)
-      )
+      if (child.patchFlag & PatchFlags.STABLE_FRAGMENT && child.key != null) {
+        ret.push(child)
+      } else {
+        ret = ret.concat(
+          getTransitionRawChildren(child.children as VNode[], keepComment)
+        )
+      }
     }
     // comment placeholders should be skipped, e.g. v-if
     else if (keepComment || child.type !== Comment) {
diff --git a/packages/vue/__tests__/TransitionGroup.spec.ts b/packages/vue/__tests__/TransitionGroup.spec.ts
index 6ba05763801..9112e2f5b98 100644
--- a/packages/vue/__tests__/TransitionGroup.spec.ts
+++ b/packages/vue/__tests__/TransitionGroup.spec.ts
@@ -508,4 +508,20 @@ describe('e2e: TransitionGroup', () => {
 
     expect(`<TransitionGroup> children must be keyed`).toHaveBeenWarned()
   })
+
+  test('should not warn v-for + template', () => {
+    createApp({
+      template: `
+        <transition-group name="test">
+          <template v-for="item in items" key="item">{{item}}</template>
+        </transition-group>
+            `,
+      setup: () => {
+        const items = ref(['a', 'b', 'c'])
+        return { items }
+      }
+    }).mount(document.createElement('div'))
+
+    expect(`<TransitionGroup> children must be keyed`).not.toHaveBeenWarned()
+  })
 })

From 7ea7a9f7f304af9a0e3a21038b30a7a58f0361c9 Mon Sep 17 00:00:00 2001
From: daiwei <daiwei521@126.com>
Date: Wed, 6 Oct 2021 22:59:06 +0800
Subject: [PATCH 2/2] chore: improve code

---
 packages/runtime-core/src/components/BaseTransition.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/runtime-core/src/components/BaseTransition.ts b/packages/runtime-core/src/components/BaseTransition.ts
index 6c4d012fb32..0c4e53feada 100644
--- a/packages/runtime-core/src/components/BaseTransition.ts
+++ b/packages/runtime-core/src/components/BaseTransition.ts
@@ -464,10 +464,10 @@ export function getTransitionRawChildren(
     const child = children[i]
     // handle fragment children case, e.g. v-for
     if (child.type === Fragment) {
-      if (child.patchFlag & PatchFlags.KEYED_FRAGMENT) keyedFragmentCount++
       if (child.patchFlag & PatchFlags.STABLE_FRAGMENT && child.key != null) {
         ret.push(child)
       } else {
+        if (child.patchFlag & PatchFlags.KEYED_FRAGMENT) keyedFragmentCount++
         ret = ret.concat(
           getTransitionRawChildren(child.children as VNode[], keepComment)
         )