Input type file is changed to text in Safari

[thbwd]

Version

2.2.4

Reproduction link

http://codepen.io/idmean/pen/MpXapy

Steps to reproduce

<div id="app">
  <div v-if="enterUser">
    <input type="text" v-model="user">
  </div>
  <div v-if="!enterUser">
    <h1>file</h1>
    <input type="file">
  </div>
</div>

JS:

const app1 = new Vue({
  el: '#app',
  data: {
    enterUser: true,
    user: 'sean',
  }
});

setTimeout(() => app1.enterUser = false, 1000);

Wait one second for the timeout to expire and the views to change.

What is expected?

The second view consisting of the heading "file" and a file input should appear.

What is actually happening?

A text input appears instead. Inspecting the DOM also shows a input element with type text was created.

---

This bug seems to occur only in Safari (10.0.3)

[posva]

Hey, thanks for opening the issue. There's something off indeed.
You can fix it by using a key attr in the file input like key="file"