title: How do I trigger a v-autocomplete "input" event with vue test utils?
body: <p>I'm trying to trigger the "input" event of a Vuetify <code>v-autocomplete</code> component inside of a unit test. From what I can tell, the unit test is quite similar to the one the <a href="https://github.com/vuetifyjs/vuetify/blob/master/packages/vuetify/test/unit/components/VAutocomplete/VAutocomplete.spec.js#L39" rel="nofollow noreferrer">Vuetify guys are using</a>, but for some reason the mock method is never called.</p>
  
  <p>The factory method simply returns a component instance made via <code>mount</code> and adds a local store, vue, and vueLoading instance.</p>
  
  <p>Would love a bit of insight here, already lost several hours to this and I'm starting to go a bit mad...</p>
  
  <p>Vuetify version: 1.4.3</p>
  
  <p>Component</p>
  
  <pre class="lang-vuejs prettyprint-override"><code>&lt;template&gt;
    &lt;v-autocomplete
      :items="options"
      :value="selectedId"
      :label="label || $t('user.filter')"
      :dark="dark"
      :class="fieldClass"
      :menu-props="{ contentClass }"
      :loading="$loading.isLoading('fetch users')"
      item-text="email"
      item-value="id"
      name="search_by_user"
      hide-details
      single-line
      clearable
      @input="updateValue($event)"
      @click.native="fetchUsers"
    /&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
  import { mapGetters } from 'vuex'
  
  export default {
    props: {
      value: {
        type: String,
        required: false,
        default: null
      },
      label: {
        type: String,
        required: false,
        default: null
      },
      dark: {
        type: Boolean,
        required: false,
        default: true
      },
      fieldClass: {
        type: String,
        required: false,
        default: 'select-user-search'
      },
      contentClass: {
        type: String,
        required: false,
        default: 'user-search'
      },
      blankItem: {
        type: Object,
        required: false,
        default: null
      }
    },
    data () {
      return {
        selectedId: this.value
      }
    },
    computed: {
      ...mapGetters(['users']),
      options () { return this.blankItem ? [this.blankItem].concat(this.users) : this.users }
    },
    created () {
      if (this.value) this.fetchUsers()
    },
    methods: {
      fetchUsers () {
        if (this.users.length) return
  
        this.$store.dispatch('FETCH_USERS', {
          fields: ['id', 'email'],
          filter: { active: 'true' }
        })
      },
      updateValue (value) {
        this.selectedId = value
        this.$emit('input', value)
      }
    }
  }
  &lt;/script&gt;
  
  &lt;style&gt;
    .select-user-search {
      overflow: hidden;
      padding-bottom: 1px;
    }
  
    .select-user-search .v-select__selections {
      overflow: hidden;
    }
  
    .select-user-search .v-select__selection {
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
  &lt;/style&gt;
  </code></pre>
  
  <p>Unit Test</p>
  
  <pre class="lang-js prettyprint-override"><code>import { mount, shallowMount, createLocalVue } from '@vue/test-utils'
  import Vuex from 'vuex'
  import VueLoading from 'vuex-loading'
  import Vuetify from 'vuetify'
  import UserSearch from 'manager/components/user/search.vue'
  
  const factory = (values, shallow = true) =&gt; {
    if (!shallow) {
      return mount(UserSearch, { ...values })
    }
    return shallowMount(UserSearch, { ...values })
  }
  
  const localVue = createLocalVue()
  
  localVue.use(Vuex)
  localVue.use(VueLoading)
  localVue.use(Vuetify)
  
  describe('UserSearch', () =&gt; {
    let actions, getters, store, vueLoading
  
    beforeEach(() =&gt; {
      actions = {
        FETCH_USERS: jest.fn()
      }
  
      getters = {
        users: () =&gt; []
      }
  
      vueLoading = new VueLoading({ useVuex: true })
  
      store = new Vuex.Store({
        actions,
        getters
      })
    })
  
    it('calls "updateValue" method when input triggered', async () =&gt; {
      const methods = {
        updateValue: jest.fn()
      }
  
      const wrapper = factory({ methods, store, localVue, vueLoading }, false)
      const input = wrapper.find('input')
  
      input.element.value = 'value'
      input.trigger('input')
  
      await wrapper.vm.$nextTick()
  
      expect(methods['updateValue']).toBeCalledWith('value')
    })
  })
  </code></pre>