chore: update test case

Author: linzhe141

packages/runtime-core/__tests__/rendererOptimizedMode.spec.ts

@@ -29,7 +29,7 @@ import {
   setBlockTracking,
   withCtx,
 } from '@vue/runtime-test'
-import { PatchFlags, SlotFlags } from '@vue/shared'
+import { PatchFlags, SlotFlags, toDisplayString } from '@vue/shared'
 import { SuspenseImpl } from '../src/components/Suspense'
 
 describe('renderer: optimized mode', () => {
@@ -270,6 +270,63 @@ describe('renderer: optimized mode', () => {
     )
   })
 
+  test('PatchFlags: PatchFlags.STABLE_FRAGMENT with change array item', async () => {
+    const count = ref(0)
+    const foo: any = []
+    function updateFoo() {
+      for (let n = 0; n < 3; n++) {
+        foo[n] = n + 1 + '_foo'
+      }
+    }
+    const Comp = {
+      setup() {
+        return () => {
+          // <div>{{ count }}</div>
+          // <div v-for='item in foo'>{{ item }}</div>
+          return (
+            openBlock(),
+            createElementBlock(
+              Fragment,
+              null,
+              [
+                createElementVNode(
+                  'div',
+                  null,
+                  toDisplayString(count.value),
+                  1 /* TEXT */,
+                ),
+                (openBlock(),
+                createElementBlock(
+                  Fragment,
+                  null,
+                  renderList(foo, item => {
+                    return createElementVNode(
+                      'div',
+                      null,
+                      toDisplayString(item),
+                      1 /* TEXT */,
+                    )
+                  }),
+                  64 /* STABLE_FRAGMENT */,
+                )),
+              ],
+              64 /* STABLE_FRAGMENT */,
+            )
+          )
+        }
+      },
+    }
+
+    render(h(Comp), root)
+    expect(inner(root)).toBe('<div>0</div>')
+    updateFoo()
+    count.value++
+    await nextTick()
+    expect(inner(root)).toBe(
+      '<div>1</div><div>1_foo</div><div>2_foo</div><div>3_foo</div>',
+    )
+  })
+
   // A Fragment with `UNKEYED_FRAGMENT` flag will always patch its children,
   // so there's no need for tracking dynamicChildren.
   test('PatchFlags: PatchFlags.UNKEYED_FRAGMENT', async () => {

packages/vue/__tests__/index.spec.ts

@@ -311,34 +311,4 @@ describe('compiler + runtime integration', () => {
     app.mount(root)
     expect(root.innerHTML).toBe('<div>60000000100000111</div>')
   })
-
-  test('should correctly update when reactive state and normal array are modified', async () => {
-    const count = ref(0)
-    const foo: any[] = []
-    function updateFoo() {
-      for (let n = 0; n < 3; n++) {
-        foo[n] = n + 1 + '_foo'
-      }
-    }
-    const app = createApp({
-      setup() {
-        return {
-          count,
-          foo,
-        }
-      },
-      template: `
-      <div>{{count}}</div>
-      <div v-for='item in foo'>{{ item }}</div>`,
-    })
-    const root = document.createElement('div')
-    app.mount(root)
-    expect(root.innerHTML).toBe('<div>0</div>')
-    updateFoo()
-    count.value++
-    await nextTick()
-    expect(root.innerHTML).toBe(
-      '<div>1</div><div>1_foo</div><div>2_foo</div><div>3_foo</div>',
-    )
-  })
 })