Vue-next: `.prop` is casting null-ish values to empty strings

[ycmjason]

Version

3.0.0-beta.4

Reproduction link

https://codepen.io/21stCenturyJonas/pen/JjYNjZX

Steps to reproduce

1. Create <video srcObject.prop="null"> template
2. See the error

What is expected?

Set the srcObject of the video dom to null.

What is actually happening?

It is trying to set it to ''.

---

Error came from here
https://github.com/vuejs/vue-next/blob/0bb1f67d12b4a7d7ae2fe1d94883333bf736aa13/packages/runtime-dom/src/modules/props.ts#L35

[jonaskuske]

Why is Vue 3 even doing this to begin with? It seems to be a convenience feature that was introduced intentionally (there's a test for it), but it's a breaking change:

In Vue 2, <div :id.prop="null" /> would result in an element with ID "null", in line with the normal DOM API where the value is automatically stringified (for better or worse). Only attributes had special treatment, where null or undefined meant removing the attribute.

[yyx990803]

FYI: there is no .prop modifier in Vue 3 anymore. Vue 3 intelligently determines if the key should be set as a prop or an attribute.

A result of this is that <div id="foo"/> also sets id as a prop - so it needs to coerce nullish values to strings in this case.