fix(v-model): should generate component-specific code for tags with "…

…is" attribute

fix #6066

src/compiler/parser/index.js

@@ -483,7 +483,9 @@ function processAttrs (el) {
             )
           }
         }
-        if (isProp || platformMustUseProp(el.tag, el.attrsMap.type, name)) {
+        if (!el.component && (
+          isProp || platformMustUseProp(el.tag, el.attrsMap.type, name)
+        )) {
           addProp(el, name, value)
         } else {
           addAttr(el, name, value)

src/platforms/web/compiler/directives/model.js

@@ -40,7 +40,11 @@ export default function model (
     }
   }
 
-  if (tag === 'select') {
+  if (el.component) {
+    genComponentModel(el, value, modifiers)
+    // component v-model doesn't need extra runtime
+    return false
+  } else if (tag === 'select') {
     genSelect(el, value, modifiers)
   } else if (tag === 'input' && type === 'checkbox') {
     genCheckboxModel(el, value, modifiers)

test/unit/features/directives/model-component.spec.js

@@ -36,6 +36,41 @@ describe('Directive v-model component', () => {
     }).then(done)
   })
 
+  it('should work with native tags with "is"', done => {
+    const vm = new Vue({
+      data: {
+        msg: 'hello'
+      },
+      template: `
+        <div>
+          <p>{{ msg }}</p>
+          <input is="test" v-model="msg">
+        </div>
+      `,
+      components: {
+        test: {
+          props: ['value'],
+          template: `<input :value="value" @input="$emit('input', $event.target.value)">`
+        }
+      }
+    }).$mount()
+    document.body.appendChild(vm.$el)
+    waitForUpdate(() => {
+      const input = vm.$el.querySelector('input')
+      input.value = 'world'
+      triggerEvent(input, 'input')
+    }).then(() => {
+      expect(vm.msg).toEqual('world')
+      expect(vm.$el.querySelector('p').textContent).toEqual('world')
+      vm.msg = 'changed'
+    }).then(() => {
+      expect(vm.$el.querySelector('p').textContent).toEqual('changed')
+      expect(vm.$el.querySelector('input').value).toEqual('changed')
+    }).then(() => {
+      document.body.removeChild(vm.$el)
+    }).then(done)
+  })
+
   it('should support customization via model option', done => {
     const spy = jasmine.createSpy('update')
     const vm = new Vue({