Throw error/warn if watch path doesn't resolve to an existing property

[WofWca]

What problem does this feature solve?

Currently, if a watch path does not address an existing property, its handler would just silently never execute.
This may cause bugs due to a typo or refactoring that involves restructuring the app model. Especially if we want to watch something like '$store.state.user.user.subscriptions'.

Here's a JSFiddle to play with: https://jsfiddle.net/WofWca/50feyxn7

What does the proposed API look like?

Just throw an error (or warn?) in such case. Like it would happen if we used this.$watch(() => this.$store.state.user.user.subscriptions, () => { .... });

[jacekkarczmarczyk]

Wouldn't it be better if watcher run when the property becomes available? Not sure if it's doable though.

[WofWca]

Wouldn't it be better if watcher run when the property becomes available? Not sure if it's doable though.

I think it's better to do this manually, in the handler.

Another possible option is optional chaining in watch path expression (like this $store.state.user.user?.subscriptions, with a question mark), but I feel like this would need a separate issue.

[despreston]

@posva I have a PR for this but I'm sort of weary of adding it to the codebase because there's already a solution for watching non-existent properties using Vue.set. You can see a test case for it here:

https://github.com/vuejs/vue/blob/dev/test/unit/modules/observer/watcher.spec.js#L36

[despreston]

In other words, for a lot of users this is going to produce a warning for expected behavior.

[posva]

@despreston yeah, the warning would only make sense if it's referring to a property of a non declared object (like the jsfiddle). Maybe this is indeed way too far for a warning

[despreston]

@posva even for a non-declared object, you can create an object with Vue.set right?

Vue.set(this, 'completelyNew')

So you could have watchers for 'completelyNew' even before it exists.

[posva]

It doesn't seemed to work when I tried

[despreston]

hm. ok. You're right, and the docs can back that up: https://vuejs.org/v2/guide/reactivity.html#Change-Detection-Caveats