]> git.ipfire.org Git - thirdparty/vuejs/core.git/commitdiff
fix(runtime-core): fix warning for absent props (#3363)
authorHcySunYang <HcySunYang@outlook.com>
Thu, 25 Mar 2021 20:22:43 +0000 (04:22 +0800)
committerGitHub <noreply@github.com>
Thu, 25 Mar 2021 20:22:43 +0000 (16:22 -0400)
fix #3362

packages/runtime-core/__tests__/componentProps.spec.ts
packages/runtime-core/src/componentProps.ts

index f89607c57e0dbe157bcf6a1af97b55c716bb58a4..001e0d5da1ae6b8b79e55b416153a305e2e4415d 100644 (file)
@@ -301,6 +301,23 @@ describe('component props', () => {
     }).not.toThrow(TypeError)
   })
 
+  test('warn absent required props', () => {
+    const Comp = {
+      props: {
+        bool: { type: Boolean, required: true },
+        str: { type: String, required: true },
+        num: { type: Number, required: true }
+      },
+      setup() {
+        return () => null
+      }
+    }
+    render(h(Comp), nodeOps.createElement('div'))
+    expect(`Missing required prop: "bool"`).toHaveBeenWarned()
+    expect(`Missing required prop: "str"`).toHaveBeenWarned()
+    expect(`Missing required prop: "num"`).toHaveBeenWarned()
+  })
+
   test('merging props from mixins and extends', () => {
     let setupProps: any
     let renderProxy: any
index 89baa373314325ac06eb2ff52aa2ff798804cd9f..91190231fb9c6bf456cee220df085337b65536e3 100644 (file)
@@ -142,7 +142,7 @@ export function initProps(
   setFullProps(instance, rawProps, props, attrs)
   // validation
   if (__DEV__) {
-    validateProps(props, instance)
+    validateProps(rawProps || {}, props, instance)
   }
 
   if (isStateful) {
@@ -264,8 +264,8 @@ export function updateProps(
   // trigger updates for $attrs in case it's used in component slots
   trigger(instance, TriggerOpTypes.SET, '$attrs')
 
-  if (__DEV__ && rawProps) {
-    validateProps(props, instance)
+  if (__DEV__) {
+    validateProps(rawProps || {}, props, instance)
   }
 }
 
@@ -462,13 +462,17 @@ function getTypeIndex(
 /**
  * dev only
  */
-function validateProps(props: Data, instance: ComponentInternalInstance) {
-  const rawValues = toRaw(props)
+function validateProps(
+  rawProps: Data,
+  props: Data,
+  instance: ComponentInternalInstance
+) {
+  const resolvedValues = toRaw(props)
   const options = instance.propsOptions[0]
   for (const key in options) {
     let opt = options[key]
     if (opt == null) continue
-    validateProp(key, rawValues[key], opt, !hasOwn(rawValues, key))
+    validateProp(key, resolvedValues[key], opt, !hasOwn(rawProps, key))
   }
 }