Как вы можете проверить, сфокусирован ли ввод с помощью утилит Vue Test? - PullRequest
Новая
       14

Как вы можете проверить, сфокусирован ли ввод с помощью утилит Vue Test?

0 голосов
/ 29 октября 2018

У меня есть директива, которая фокусируется на вводе. И я хочу проверить эту директиву. Единственная проблема заключается в том, что я не могу найти способ проверить, сфокусирован ли ввод

Это мой простой макетный компонент 

 <template>
  <div v-directive>
    <input/>
  </div>
</template>

Это моя директива: 

import Vue from 'vue'

export const focusInput = () => {
  return {
    inserted(el: any) {
      el.getElementsByTagName('input')[0].focus()
    }
  }
}

export default Vue.directive('focus-input', focusInput())

Это мой тест: 

import Vue from 'vue'
import { mount , createLocalVue} from '@vue/test-utils'

import FocusInputMock from './mockComponents/FocusInputMock.vue'
import {focusInput} from '@/directives/focusInput';

const localVue = createLocalVue()

localVue.directive('directive',  focusInput())


test('update content after changing state', () => {
  const wrapper = mount(FocusInputMock, {
    localVue
  })
  Vue.nextTick(function () {
    expect(wrapper.find('input')) // I have to expect for this input to be focused
  });
})

У кого-нибудь есть идеи? Я безуспешно читаю документы по использованию Jest и Vue.

1 Ответ

0 голосов
/ 29 октября 2018

При монтаже макета компонента передайте { attachToDocument: true }

и попробуйте это: 

let input = wrapper.find('input').element
expect(input).toBe(document.activeElement);
...