Default prop value is not reflected in custom element property
Vue version
3.3.4
Link to minimal reproduction
https://stackblitz.com/edit/vitejs-vite-jpamc8
Steps to reproduce
Two issues with props inside elements defined with defineCustomElement
:
- vue component respects default value configured with ie.
defineProps
but it's not reflected in host property value on creation - setting value on custom element and removing it afterwards strips default value and returns
null
instead
What is expected?
- prop's defaults are reflected on a host element
- prop's defaults are used as a fallback in case value was removed on a host
What is actually happening?
undefined
is returned instead of prop's defaultnull
is returned instead of prop's default once ie. host's value attribute was set and then removed by a user
System Info
No response
Any additional comments?
This is troublesome with form inputs where inputs are expected to return empty string ''
as no value and never returns null
(they are actually always converted to ''
so el.value = null
results in value
being an empty string).
Just rename the prop from one of the components.
In HelloWorld.vue rename hello
to value
OR
In MyCustomElement.vue rename value
to hello
.