change selected option of v-select using vue-test-util

Question

I'm trying to test a component builded with vuetify. For that I'm using vue-test-utils. My goal is to perform a change in the v-select field, and assert hat a mutation is performed. here is my code:

<div id="app">
  <v-app id="inspire">
    <v-container fluid>
      <v-layout row wrap>
        <v-flex xs6>
          <v-subheader>Standard</v-subheader>
        </v-flex>
        <v-flex xs6>
          <v-select
            :items="items"
            v-model="e1"
            label="Select"
            single-line
          ></v-select>
        </v-flex>
      </v-layout>
    </v-container>
  </v-app>
</div>

The first test is ok when i set the data:

componentWrapper.setData({items: storesList})
expect(componentWrapper.vm.$data.items).toHaveLength(2)

I now want to change the selected value I try:

componentWrapper.findAll('#option').at(1).setSelected()

And also

componentWrapper.find('el-select')

Can someone help me to retrieve the select and then change the selected value? Thanks for your support.

Answer 1

Use wrapper.vm.selectItem('foo'). It works for me.

I found this in vuetify v-select tests:

Old: ~~https://github.com/vuetifyjs/vuetify/blob/master/packages/vuetify/test/unit/components/VSelect/VSelect.spec.js#L533~~

New: https://github.com/vuetifyjs/vuetify/blob/b2abe9fa274feeb0c5033bf12cc48276d4ac5a78/packages/vuetify/test/unit/components/VSelect/VSelect.spec.js#L28

Edit: Updated link.