fix(runtime-core): fix kebab-case prop required warning

fix #3495 ref #3363
vuejs · Mar 27, 2021 · 2121c32 · 2121c32
1 parent 37c1709
commit 2121c32
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 1 deletion.
diff --git a/packages/runtime-core/__tests__/componentProps.spec.ts b/packages/runtime-core/__tests__/componentProps.spec.ts
@@ -319,6 +319,25 @@ describe('component props', () => {
     expect(`Missing required prop: "num"`).toHaveBeenWarned()
   })
 
+  // #3495
+  test('should not warn required props using kebab-case', async () => {
+    const Comp = {
+      props: {
+        fooBar: { type: String, required: true }
+      },
+      setup() {
+        return () => null
+      }
+    }
+    render(
+      h(Comp, {
+        'foo-bar': 'hello'
+      }),
+      nodeOps.createElement('div')
+    )
+    expect(`Missing required prop: "fooBar"`).not.toHaveBeenWarned()
+  })
+
   test('merging props from mixins and extends', () => {
     let setupProps: any
     let renderProxy: any

diff --git a/packages/runtime-core/src/componentProps.ts b/packages/runtime-core/src/componentProps.ts
@@ -480,7 +480,12 @@ function validateProps(
   for (const key in options) {
     let opt = options[key]
     if (opt == null) continue
-    validateProp(key, resolvedValues[key], opt, !hasOwn(rawProps, key))
+    validateProp(
+      key,
+      resolvedValues[key],
+      opt,
+      !hasOwn(rawProps, key) && !hasOwn(rawProps, hyphenate(key))
+    )
   }
 }