Kebab-case boolean props are casted to string when used in custom elements
Vue version
3.2.45
Link to minimal reproduction
https://codesandbox.io/s/adoring-bell-zg9vvr
Steps to reproduce
- Create a SFC component with a camelCase boolean prop
- Use it in your app passing the prop kebab-case
- Prop is well received but casted to string
- If you pass the prop camelCase it works fine
What is expected?
A Boolean prop in the component
What is actually happening?
A String prop in the component
System Info
No response
Any additional comments?
No response
I think this problem is related to the online editor. The performance in Vue SFC Playground is normal => here when i run in native code it works fine
No, it's specific to the combo of a boolean kebap-case prop being passed to a Vue component that's being wrapped with defineCustomElement()
.
https://github.com/vuejs/core/pull/7412 will solve it for the most part, I think, but would still be an edge case left concerning async custom elements, which I hope to address after we are done with #7412.