Просмотр исходного кода

feat: warn misspelled keys on prop validation object (#7198)

Alexander Sokolov 8 лет назад
Родитель
Сommit
d02bb37efb
3 измененных файлов с 46 добавлено и 0 удалено
  1. 4 0
      src/core/util/options.js
  2. 25 0
      src/core/util/props.js
  3. 17 0
      test/unit/features/options/props.spec.js

+ 4 - 0
src/core/util/options.js

@@ -4,6 +4,7 @@ import config from '../config'
 import { warn } from './debug'
 import { nativeWatch } from './env'
 import { set } from '../observer/index'
+import { assertPropObject } from './props'
 
 import {
   ASSET_TYPES,
@@ -293,6 +294,9 @@ function normalizeProps (options: Object, vm: ?Component) {
     for (const key in props) {
       val = props[key]
       name = camelize(key)
+      if (process.env.NODE_ENV !== 'production' && isPlainObject(val)) {
+        assertPropObject(name, val, vm)
+      }
       res[name] = isPlainObject(val)
         ? val
         : { type: val }

+ 25 - 0
src/core/util/props.js

@@ -18,6 +18,13 @@ type PropOptions = {
   validator: ?Function
 };
 
+const propOptionsNames = [
+  'type',
+  'default',
+  'required',
+  'validator'
+]
+
 export function validateProp (
   key: string,
   propOptions: Object,
@@ -84,6 +91,24 @@ function getPropDefaultValue (vm: ?Component, prop: PropOptions, key: string): a
     : def
 }
 
+/**
+ * Assert whether a prop object keys are valid.
+ */
+export function assertPropObject (
+  propName: string,
+  prop: Object,
+  vm: ?Component
+) {
+  for (const key in prop) {
+    if (propOptionsNames.indexOf(key) === -1) {
+      warn(
+        `Invalid key "${key}" in validation rules object for prop "${propName}".`,
+        vm
+      )
+    }
+  }
+}
+
 /**
  * Assert whether a prop is valid.
  */

+ 17 - 0
test/unit/features/options/props.spec.js

@@ -512,4 +512,21 @@ describe('Options props', () => {
       expect(`"${attr}" is a reserved attribute`).toHaveBeenWarned()
     })
   })
+
+  it('should warn about misspelled keys in prop validation object', () => {
+    new Vue({
+      template: '<test></test>',
+      components: {
+        test: {
+          template: '<div></div>',
+          props: {
+            value: { reqquired: true },
+            count: { deafult: 1 }
+          }
+        }
+      }
+    }).$mount()
+    expect(`Invalid key "reqquired" in validation rules object for prop "value".`).toHaveBeenWarned()
+    expect(`Invalid key "deafult" in validation rules object for prop "count".`).toHaveBeenWarned()
+  })
 })