fix #8862: cannot watch unicode properties like 'a.中文'

[derek-li]

Hi all at Vue!

This pull request resolves the issue regarding watchers not watching unicode properties like 'a.中文'.

My method for resolving this case is to throw a warning when non-alphanumeric, $, or _ characters are detected. My reasoning behind throwing a warning instead of supporting special characters is that I think supporting special characters would promote poor naming habits that could only make code more difficult to read and understand.

I'm pretty new to open source so any feedback would be awesome and please let me know if you'd like to see any changes or improvements!

Link to issue: #8862

What kind of change does this PR introduce? (check at least one)

• Bugfix
• Feature
• Code style update
• Refactor
• Build-related changes
• Other, please describe:

Does this PR introduce a breaking change? (check one)

• Yes
• No

If yes, please describe the impact and migration path for existing applications:

The PR fulfills these requirements:

• It's submitted to the dev branch for v2.x (or to a previous version branch), not the master branch
• When resolving a specific issue, it's referenced in the PR's title (e.g. fix #xxx[,#xxx], where "xxx" is the issue number)
• All tests are passing: https://github.com/vuejs/vue/blob/dev/.github/CONTRIBUTING.md#development-setup
• New/updated tests are included

If adding a new feature, the PR's description includes:

• A convincing reason for adding this feature (to avoid wasting your time, it's best to open a suggestion issue first and wait for approval before working on it)

[posva]

This is not fixing the issue it says to be fixing 🤔

[derek-li]

@posva The issue was that Vue was throwing an incorrect warning regarding watchers only watching dot-delimited paths.

I added an error to show that Vue does not support using special characters in property naming.
For reasons I stated above, I feel that this is the appropriate solution to this issue rather than supporting bad coding habits that would lead to code that is more difficult to read and understand.

However, if this is the route that you think is better I'm open to making another pull request to address this issue. What do you think?

[yyx990803]

I think that's a decent workaround, not technically a fix, but I agree with the approach to the original issue.

[yyx990803]

I don't like that we are relying on magic return values (false) here, as the logic is separated in two places. Also the check is warning only so it's better to place it right here inside a if (process.env.NODE_ENV !== 'production') { ... } block, using an inline regexp.

[derek-li]

@yyx990803 Thanks for taking the time to review this PR.

I've gone ahead and made the commits to stop relying on random return values. I also tried your suggestion with having the check in an if (process.env.NODE_ENV !== 'production') { ... } block, but felt that it was unclear to have two regex checks in different places (watcher and parsePath) and did not resolve your comment on the logic being separated, so I grouped them together.

Thanks again and please let me know what you think!

[yyx990803]

Note this may become invalid if we merge #8666, I'm still debating whether we should support it.

[yyx990803]

Closed via #8666