Can't get input value based on v-model about avoriaz

[willypt]

Hi @swingboat, it works as expected.
Vue-related attributes and value textfield should not be shown on the rendered HTML, as they are when being inspected on Chrome DevTools or other similar tool.

However, if you need to access the value, you may try this snippet

<template>
  <div>
    <input type="text" v-model="foo" ref="fooinput" >
    {{foo}}
  </div>
</template>

<script>
  export default {
    name: 'foo',
    props: [
      'foo'
    ]
  };
</script>

import Vue from 'vue'
import Testing from '@/components/Testing'
import { mount } from 'avoriaz';

describe('Test v-model', function () {
  it('check v-model value', function (done) {
    const wrapper = mount(Testing, {
      propsData: {
        'foo': 'initial value'
      }
    });
    console.log('START MOUNTING')
    console.log('Mounted prop value: ', wrapper.vm.$refs.fooinput.value)

    console.log('MODIFY VALUE VIA "VALUE" JAVASCRIPT')
    wrapper.vm.$refs.fooinput.value = '1st change'
    console.log('Value from Input:', wrapper.vm.$refs.fooinput.value)

    console.log('MODIFY VALUE FROM VM ATTRIBUTE')
    wrapper.vm.foo = '2nd change'
    console.log('Modified Prop foo: ', wrapper.getProp('foo'))
    Vue.nextTick(() => {
      // Need to wait for Vue to propagate the changes
      console.log('Value from Input:', wrapper.vm.$refs.fooinput.value)
      done()
    })
  });
});

[swingboat]

Thanks willypt. I already understood it, Thanks!