WATCH_ARRAY in @vue/compat is triggered by CoreModal.vue

[codepainters]

Version

vue-final-modal: 4.4.5
vue: 3.3.4
@vue/compat: 3.3.4

What is Expected?

Warning-free execution.

What is actually happening?

This calll to watch() triggers a warning from @vue/compat:

vue-final-modal/packages/vue-final-modal/src/components/CoreModal/CoreModal.vue

Lines 133 to 136 in ef20943

	watch(() => [props.zIndexFn, index.value], () => {
	if (visible.value)
	refreshZIndex(index.value)
	})

Actually the warning is legit, as far as I udnerstand the Vue docs:

When you call watch() directly on a reactive object, it will implicitly create a deep watcher - the callback will be triggered on all nested mutations.
This should be differentiated with a getter that returns a reactive object - in the latter case, the callback will only fire if the getter returns a different object.

[hunterliu1003]

@codepainters
I am not familiar of what is @vue/compat doing. Can you provide a minimal reproduction?

[codepainters]

Basically @vue/compat shows warnings for anything that might need taking care of when transitioning from Vue 2 to Vue 3 (which is what we are doing now).

I'll try to find some time to isolate it.

[joonas-erho]

@hunterliu1003 This issue persists in version 4.5.4 when using @vue/compat. I believe it could be fixed by adding the deep: true property to the watcher in question.