Cannot remove size attribute of <input>.

[ota-meshi]

Version

3.0.11

Reproduction link

https://sfc.vuejs.org/#eyJBcHAudnVlIjoiPHRlbXBsYXRlPlxuICA8aW5wdXQgOnNpemU9XCJzaXplXCIgPlxuPC90ZW1wbGF0ZT5cblxuPHNjcmlwdD5cbmV4cG9ydCBkZWZhdWx0IHtcbiAgZGF0YSAoKSB7XG5cdFx0cmV0dXJuIHtcbiAgICAgIHNpemU6IG51bGwsXG4gICAgfSBcbiAgfSBcbn1cbjwvc2NyaXB0PiJ9

Steps to reproduce

• Open the link.
• Display error: Uncaught (in promise): Failed to set the 'size' property on 'HTMLInputElement': The value provided is 0, which is an invalid size.

What is expected?

Renders <input> without the size attribute because I specified null for the size.

What is actually happening?

An error will occur.

---

Even if undefined is given, an error will occur.

[edison1105]

duplicate of #3294

[ota-meshi]

Hi @edison1105.

That issue looked to me like <input :size="0"> issue.
This issue is <input :size="null"> issue.

How do I remove the size attribute?

[edison1105]

Is this what you want?

<template>
  <input ref="el" :size="size" >
</template>

<script>
export default {
  data () {
    return {
      size: 1,
    } 
  },
  mounted(){
    this.$refs.el.setAttribute('size',1)
    this.$refs.el.removeAttribute('size')
  }
}
</script>

[posva]

maybe we should remove the size attribute if it's set to null (like with other attributes).

You should also be able to use an object with v-bind and remove the size property from that object