@ Vue / test-utils shallowMount выводит «[Vue warn]: неизвестный пользовательский элемент» для компонентов vuetify - PullRequest
Новая
       73

@ Vue / test-utils shallowMount выводит «[Vue warn]: неизвестный пользовательский элемент» для компонентов vuetify

1 голос
/ 21 февраля 2020

Мой модульный тест в Vue выводит следующее предупреждение не только для <v-col>, но и для каждого отдельного компонента vuetify:

[Vue warn]: неизвестный пользовательский элемент: - правильно ли вы зарегистрировали компонент? Для рекурсивных компонентов не забудьте указать опцию «name».

Я создал localVue и добавил Vuetify, но, похоже, это не работает. Это мой тестовый пример: 

import { shallowMount, createLocalVue } from '@vue/test-utils'
import expect from 'expect'
import ProjetoShow from '../../views/Projeto/ProjetoShow.vue'
import Vuetify from 'vuetify'

describe('ProjetoShow component', () => {
    let wrapper
    let localVue
    beforeEach(() => {
        localVue = createLocalVue()
        localVue.use(Vuetify)
    })

    it('renders correctly', ()=> {
        let vuetify = new Vuetify()
        wrapper = shallowMount(ProjetoShow, {localVue, vuetify})
        expect(wrapper.find('h2').text()).toContain('PROJETO')
    })

})

версии моих пакетов в package.json

"devDependencies": {
    "@vue/test-utils": "^1.0.0-beta.31",
    "axios": "^0.19.0",
    "cross-env": "^5.1",
    "expect": "^24.9.0",
    "jsdom": "^15.1.1",
    "jsdom-global": "^3.0.2",
    "laravel-mix": "^4.0.7",
    "lodash": "^4.17.13",
    "mocha": "^6.2.0",
    "mochapack": "^1.1.5",
    "resolve-url-loader": "^2.3.1",
    "sass": "^1.15.2",
    "sass-loader": "^7.1.0",
    "vue": "^2.5.17",
    "vue-template-compiler": "^2.6.10"
},
"dependencies": {
    "vue-router": "^3.1.3",
    "vuetify": "^2.2.15",
    "vuex": "^3.1.1"
},

Ответы [ 2 ]

0 голосов
/ 18 марта 2020

Я сделал ошибку, добавив vuetify к localVue, а не Vue. Это изменилось исправлено. В зависимости от используемой версии это может привести к некоторым ошибкам. Обновите vuetify, @vue/test-utils и mocha до последних версий, если что-то пойдет не так. 

import { shallowMount, createLocalVue } from '@vue/test-utils'
import expect from 'expect'
import ProjetoShow from '../../views/Projeto/ProjetoShow.vue'
import Vuetify from 'vuetify'
import VueRouter from 'vue-router'
import Vue from 'vue'
Vue.use(Vuetify)

describe('ProjetoShow component', () => {
    let wrapper
    let localVue
    beforeEach(() => {
        localVue = createLocalVue()
        localVue.use(VueRouter)
    })

    it('renders correctly', ()=> {
        let router = new VueRouter()
        let vuetify = new Vuetify()
        wrapper = shallowMount(ProjetoShow, {localVue, router, vuetify})
        expect(wrapper.find('h2').text()).toContain('PROJETO')
    })

})
0 голосов
/ 21 февраля 2020

В документации Vuetify по Unit Testing , они объявляют let vuetify в блоке describe, затем в beforeEach, присваивают эту переменную new Vuetify()

Дон не вижу, что вы на самом деле инициализируете Vuetify где-нибудь в своем тестовом коде, так что, возможно, это то, что здесь нужно.

...