fix(runtime-core/scheduler): avoid duplicate updates of child component

packages/runtime-core/src/renderer.ts

@@ -30,7 +30,12 @@ import {
   isFunction,
   PatchFlags
 } from '@vue/shared'
-import { queueJob, queuePostFlushCb, flushPostFlushCbs } from './scheduler'
+import {
+  queueJob,
+  queuePostFlushCb,
+  flushPostFlushCbs,
+  invalidateJob
+} from './scheduler'
 import {
   effect,
   stop,
@@ -895,6 +900,9 @@ export function createRenderer<
         } else {
           // normal update
           instance.next = n2
+          // in case the child component is also queued, remove it to avoid
+          // double updating the same child component in the same flush.
+          invalidateJob(instance.update)
           // instance.update is the reactive effect runner.
           instance.update()
         }

packages/runtime-core/src/scheduler.ts

@@ -1,7 +1,7 @@
 import { ErrorCodes, callWithErrorHandling } from './errorHandling'
 import { isArray } from '@vue/shared'
 
-const queue: Function[] = []
+const queue: (Function | null)[] = []
 const postFlushCbs: Function[] = []
 const p = Promise.resolve()
 
@@ -22,6 +22,13 @@ export function queueJob(job: () => void) {
   }
 }
 
+export function invalidateJob(job: () => void) {
+  const i = queue.indexOf(job)
+  if (i > -1) {
+    queue[i] = null
+  }
+}
+
 export function queuePostFlushCb(cb: Function | Function[]) {
   if (!isArray(cb)) {
     postFlushCbs.push(cb)
@@ -64,6 +71,9 @@ function flushJobs(seen?: CountMap) {
     seen = seen || new Map()
   }
   while ((job = queue.shift())) {
+    if (job === null) {
+      continue
+    }
     if (__DEV__) {
       checkRecursiveUpdates(seen!, job)
     }