Как работает vue test utils jest?

Question

[jekanok]

Я использую в проекте готовые компоненти element.io и хотел протестировать выполненую работу с помощью vue test utils он написан на jest, когда я написал первый тест для пробы

import {
  mount
} from '@vue/test-utils'
import register from '@/components/form-reg.vue'

describe('Register', () => {
  const wrapper = mount(register)
  it('имеет кнопку', () => {
    expect(wrapper.contains('button')).toBe(true)
  })
})

мне выдал ошибку:

[Vue warn]: Unknown custom element: <el-row> - did you register the component correctly? For recursive components, make sure to provide the "name" option.

....
Кто знает как решить эту проблему?
Спасибо за ответ!

Answer 1

[Алексей Ярков]

Либо где-нибудь в setup.js импортируете element-ui (типа такого):

import Vue from "vue";
import ElementUI from 'element-ui';

Vue.use(ElementUI);

Либо в тесте делайте заглушки:

import {mount} from '@vue/test-utils'
import register from '@/components/form-reg.vue'

describe('Register', () => {
  const wrapper = mount(register, {
    stubs: {
      'el-row': '<div></div>'
    }
  })
  it('имеет кнопку', () => {
    expect(wrapper.contains('button')).toBe(true)
  })
})

Comments

[jekanok]

Первый способ подошел, огромное спасибо!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

[Алексей Ярков]

jekanok, та не за что ))))))))))))))))))))))))))))))))))))

Answer 2

[Alex]

Вам нужно вызвать use перед вашими тестами. Например так

import { createLocalVue, mount } from '@vue/test-utils'
import ElementUI from 'element-ui';

const localVue = createLocalVue()
localVue.use(ElementUI);

И далее передавать экземпляр в тест
const wrapper = mount(register, {localVue})

См. документацию