feat(v-model): warn when v-model is bound on non-existant key

Warn when v-model is bound to a non-existant key since that key
will not be reactive.

Fixes vuejs#5932

Author: chriscasola

src/compiler/codegen/index.js

@@ -291,13 +291,16 @@ function genDirectives (el: ASTElement, state: CodegenState): string | void {
       needRuntime = !!gen(el, dir, state.warn)
     }
     if (needRuntime) {
+      let warning
       hasRuntime = true
       res += `{name:"${dir.name}",rawName:"${dir.rawName}"${
         dir.value ? `,value:(${dir.value}),expression:${JSON.stringify(dir.value)}` : ''
       }${
         dir.arg ? `,arg:"${dir.arg}"` : ''
       }${
         dir.modifiers ? `,modifiers:${JSON.stringify(dir.modifiers)}` : ''
+      }${
+        process.env.NODE_ENV !== 'production' && (warning = genValidateValue(dir.value)) ? `,warn:${warning}` : ''
       }},`
     }
   }
@@ -490,3 +493,15 @@ function transformSpecialNewlines (text: string): string {
     .replace(/\u2028/g, '\\u2028')
     .replace(/\u2029/g, '\\u2029')
 }
+
+function genValidateValue (expr: string): string {
+  const parts = expr.split('.')
+  if (parts.length > 1) {
+    const parent = parts.slice(0, -1).join('.')
+    const last = parts[parts.length - 1]
+    if (last.indexOf('[') < 0) {
+      return `!('${last}' in ${parent}) ? 'You are binding v-model to a key that does not exist, expression: ${expr}' : ''`
+    }
+  }
+  return ''
+}

src/platforms/web/runtime/directives/model.js

@@ -41,6 +41,10 @@ export default {
         }
       }
     }
+
+    if (process.env.NODE_ENV !== 'production' && 'warn' in binding) {
+      warn(binding.warn)
+    }
   },
   componentUpdated (el, binding, vnode) {
     if (vnode.tag === 'select') {

test/unit/features/directives/model-text.spec.js

@@ -354,5 +354,19 @@ describe('Directive v-model text', () => {
         done()
       }, 16)
     })
+
+    it('warn binding v-model to non-existant data property', () => {
+      new Vue({
+        data: {
+          testData: {}
+        },
+        template: `
+          <div>
+            <input v-model="testData.missingKey">
+          </div>
+        `
+      }).$mount()
+      expect('You are binding v-model to a key that does not exist, expression: testData.missingKey').toHaveBeenWarned()
+    })
   }
 })