Version

3.0.2

Reproduction link

https://jsfiddle.net/h8k7rp45/1/

Steps to reproduce

just click the text Hello Vuejs, then look at the console, it will output undefined once, then after 1 second, output hehe0. If I remove the setTimeout, the hehe0 will never output

What is expected?

output hehe0 when CompA mounted

What is actually happening?

not output hehe0 when CompA mounted

it mainly because watch & watchEffect push preJobs, and ref.value = element worked at queue jobs (the middle), when push preJobs, it's still flushing, so it will not flush again. And after postEffects, no queue jobs and postEffects add, it won't run preJobs again.

is there any side effects if we flushJobs when pendingPreFlushCbs.length > 0

if (queue.length || pendingPostFlushCbs.length || pendingPreFlushCbs.length) {
      flushJobs(seen)
    }

this code passed all test

Do this:

watchEffect(() => ..., { flush: 'post' })

Do this:

watchEffect(() => ..., { flush: 'post' })

Yeah, I know, but the implemention is confusing so it still need to talk if this is as expected or not.

You can find more info in existing issues like https://github.com/vuejs/vue-next/issues/1706 https://github.com/vuejs/vue-next/issues?q=is%3Aissue+sort%3Aupdated-desc+watch+post+is%3Aclosed

@posva I did not find one issue that exactly match mine, besides, can you just give me an answer? Is this by design? So it mean if I want to use ref to attach dom element I have to use flush: post to watch it right? I don't quite understand why you guys so eager to close issues.